/* Шрифты: текст — системный шрифт телефона (0 КБ, лучше всего читается на любом экране); цифры времени и цен — фирменные (Unbounded, 3 КБ, только 0–9 и двоеточие). */
@font-face{font-family:"PaytDigits";src:url("fonts/PaytDigits.woff") format("woff");font-weight:100 900;font-display:swap;unicode-range:U+0030-003A}
:root{--f-sys:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;--f-text:var(--f-sys);--f-head:"PaytDigits",var(--f-sys)}
/* Payt — стили мини-приложения. Собраны из дизайн-системы design/build (common4.py, proto_css.py); правки — здесь. */

:root,.scene{--bg0:#1b1a18;--bg1:#080808;--bg2:#030303;--fg:#fff;--t2:rgba(255,255,255,.70);--t3:rgba(255,255,255,.55);--line:rgba(255,255,255,.1);--sep:rgba(255,255,255,.085);
--gl1:rgba(255,255,255,.115);--gl2:rgba(255,255,255,.03);--gl3:rgba(255,255,255,.065);--rim1:rgba(255,255,255,.6);--rim2:rgba(255,255,255,.05);--rim3:rgba(255,255,255,.24);
--ghi:rgba(255,255,255,.22);--gsh:0 30px 60px -30px rgba(0,0,0,.95);--mat:rgba(10,10,10,.66);--matline:rgba(255,255,255,.08);
--sel-bg:linear-gradient(180deg,#ffffff,#e9e2d7);--sel-fg:#0a0a0a;--sel-sh:inset 0 1px 0 #fff,inset 0 -8px 14px -8px rgba(120,96,70,.45),0 12px 30px -10px rgba(243,238,231,.42);
--well:rgba(0,0,0,.35);--wsh:inset 0 1px 3px rgba(0,0,0,.55),inset 0 -1px 0 rgba(255,255,255,.1);--orbA:rgba(255,255,255,.13);--orbB:rgba(217,201,180,.16);--orbC:rgba(255,255,255,.07);
--ok:#9fe3bd;--late:#ecca94;--bad:#ff9d9d;--idle:rgba(255,255,255,.62);--photo:rgba(0,0,0,.55);--glow:rgba(255,255,255,.2);--sheet:linear-gradient(165deg,rgba(46,44,41,.92),rgba(16,16,16,.95));--dim:rgba(0,0,0,.42)}
.scene.light{--bg0:#ffffff;--bg1:#f3f0eb;--bg2:#ebe6df;--fg:#0b0b0b;--t2:rgba(0,0,0,.66);--t3:rgba(0,0,0,.56);--line:rgba(0,0,0,.08);--sep:rgba(0,0,0,.07);
--gl1:rgba(255,255,255,.88);--gl2:rgba(255,255,255,.58);--gl3:rgba(255,255,255,.72);--rim1:rgba(255,255,255,1);--rim2:rgba(255,255,255,.3);--rim3:rgba(0,0,0,.06);
--ghi:rgba(255,255,255,.9);--gsh:0 24px 50px -28px rgba(60,45,30,.35);--mat:rgba(250,248,245,.74);--matline:rgba(0,0,0,.06);
--sel-bg:linear-gradient(180deg,#2a2a2a,#050505);--sel-fg:#fff;--sel-sh:inset 0 1px 0 rgba(255,255,255,.25),0 12px 26px -10px rgba(0,0,0,.45);
--well:rgba(0,0,0,.045);--wsh:inset 0 1px 2px rgba(0,0,0,.07),inset 0 0 0 1px rgba(0,0,0,.05);--orbA:rgba(217,201,180,.55);--orbB:rgba(255,255,255,.9);--orbC:rgba(217,201,180,.35);
--ok:#15703f;--late:#8a5a12;--bad:#b92f2f;--idle:rgba(0,0,0,.58);--photo:rgba(0,0,0,.35);--glow:rgba(0,0,0,.07);--sheet:linear-gradient(165deg,rgba(255,255,255,.95),rgba(246,243,238,.97));--dim:rgba(0,0,0,.18)}
body{margin:0;font-family:var(--f-text);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
button{font-family:inherit;cursor:pointer;appearance:none;-webkit-appearance:none;border:0;background:none;color:inherit;padding:0;font-size:inherit}
input,textarea{font-family:inherit}
a{color:inherit;text-decoration:none}
@property --a{syntax:"<angle>";initial-value:0deg;inherits:false}
@keyframes d1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,60px) scale(1.15)}}
@keyframes d2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-50px,-36px) scale(1.2)}}
@keyframes d3{0%,100%{transform:translate(0,0)}50%{transform:translate(30px,-50px)}}
@keyframes rise{from{opacity:0;transform:translateY(18px) scale(.98);filter:blur(6px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes depthIn{from{opacity:0;transform:translateY(28px) scale(.965);filter:blur(12px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes spin{to{--a:360deg}}
@keyframes rot{to{transform:rotate(360deg)}}
@keyframes sweep{0%{transform:translateX(-160%) skewX(-20deg)}55%,100%{transform:translateX(360%) skewX(-20deg)}}
@keyframes beat{0%{box-shadow:0 0 0 0 var(--glow)}70%{box-shadow:0 0 0 10px transparent}100%{box-shadow:0 0 0 0 transparent}}
@keyframes pop{0%{transform:scale(.3);opacity:0}65%{transform:scale(1.08);opacity:1}100%{transform:none;opacity:1}}
@keyframes ripple{0%{transform:scale(.7);opacity:.6}100%{transform:scale(2.7);opacity:0}}
@keyframes drawc{to{stroke-dashoffset:0}}
@keyframes load{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
@keyframes nowp{0%,100%{opacity:.6}50%{opacity:1}}
.scene{position:relative;overflow:hidden;color:var(--fg);box-sizing:border-box;background:radial-gradient(120% 70% at 50% -12%,var(--bg0) 0%,var(--bg1) 55%,var(--bg2) 100%)}
.scene::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.07;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");z-index:60}
.orb{position:absolute;border-radius:50%;pointer-events:none}
.o1{background:radial-gradient(circle,var(--orbA),transparent 68%);animation:d1 14s ease-in-out infinite}
.o2{background:radial-gradient(circle,var(--orbB),transparent 68%);animation:d2 17s ease-in-out infinite}
.o3{background:radial-gradient(circle,var(--orbC),transparent 68%);animation:d3 19s ease-in-out infinite}
.content{position:relative;z-index:1}
.t2{color:var(--t2)}.t3{color:var(--t3)}.b{font-weight:700}
.lab{font-family:var(--f-head);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--t2);font-weight:500;padding-left:4px}
.lt{font-family:var(--f-head);font-size:22px;font-weight:500;letter-spacing:.01em;line-height:1.2}
.h1{font-family:var(--f-head);font-size:19px;font-weight:500;letter-spacing:0;line-height:1.25}
.tab{font-variant-numeric:tabular-nums}
.r1{animation:rise .7s cubic-bezier(.2,.8,.2,1) .05s both}.r2{animation:rise .7s cubic-bezier(.2,.8,.2,1) .13s both}.r3{animation:rise .7s cubic-bezier(.2,.8,.2,1) .21s both}.r4{animation:rise .7s cubic-bezier(.2,.8,.2,1) .29s both}.r5{animation:rise .7s cubic-bezier(.2,.8,.2,1) .37s both}.r6{animation:rise .7s cubic-bezier(.2,.8,.2,1) .45s both}.r7{animation:rise .7s cubic-bezier(.2,.8,.2,1) .53s both}
.g{position:relative;box-sizing:border-box;border-radius:24px;background:linear-gradient(155deg,var(--gl1),var(--gl2) 60%,var(--gl3));backdrop-filter:blur(30px) saturate(150%);-webkit-backdrop-filter:blur(30px) saturate(150%);box-shadow:inset 0 1px 0 var(--ghi),var(--gsh);transition:box-shadow .5s,background .5s,transform .55s cubic-bezier(.25,1,.5,1);transition:box-shadow .5s,background .5s,transform .55s linear(0,0.0154,0.0555,0.1128,0.1811,0.2555,0.3323,0.4086,0.4822,0.5518,0.6164,0.6753,0.7283,0.7755,0.8169,0.8529,0.8837,0.91,0.932,0.9502,0.9652,0.9773,0.9868,0.9943,1,1.0042,1.0072,1.0092,1.0104,1.011,1.0111,1.0108,1.0104,1.0097,1.0089,1.0081,1.0072,1.0064,1.0056,1.0048,1.0041,1.0035,1.0029,1)}
.g::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(145deg,var(--rim1),var(--rim2) 38%,var(--rim2) 62%,var(--rim3));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.g.r18{border-radius:18px}.g.r22{border-radius:22px}
.lit{position:relative;overflow:hidden}
.lit::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(150px circle at var(--lx,50%) var(--ly,50%),var(--glow),transparent 62%);opacity:0;transition:opacity .45s;pointer-events:none}
.lit.press::after{opacity:1;transition:opacity .06s}
.pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;color:var(--fg);font:inherit;font-weight:600;font-size:15px;border-radius:999px;padding:11px 18px;position:relative;box-sizing:border-box;white-space:nowrap;
background:linear-gradient(180deg,var(--gl1),var(--gl2));backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%);box-shadow:inset 0 1px 0 var(--ghi),inset 0 0 0 1px var(--line),0 10px 22px -12px rgba(0,0,0,.6);
transition:background .4s,color .35s,box-shadow .45s,transform .55s cubic-bezier(.25,1,.5,1),opacity .3s;transition:background .4s,color .35s,box-shadow .45s,transform .55s linear(0,0.0154,0.0555,0.1128,0.1811,0.2555,0.3323,0.4086,0.4822,0.5518,0.6164,0.6753,0.7283,0.7755,0.8169,0.8529,0.8837,0.91,0.932,0.9502,0.9652,0.9773,0.9868,0.9943,1,1.0042,1.0072,1.0092,1.0104,1.011,1.0111,1.0108,1.0104,1.0097,1.0089,1.0081,1.0072,1.0064,1.0056,1.0048,1.0041,1.0035,1.0029,1),opacity .3s}
.pill:active,.g:active,.cta:active{transform:scale(.965)}
.pill{min-height:44px;padding-top:0;padding-bottom:0}.pill.sm{min-height:36px;padding:0 14px;font-size:13px;gap:6px}.pill.icon{width:44px;height:44px;padding:0}   /* 44px — удобная зона нажатия пальцем */
.pill.mute{color:var(--t2);font-weight:500}
.pill.on,.on{background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh)}
.cta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;box-sizing:border-box;position:relative;overflow:hidden;border-radius:999px;padding:17px 22px;font-size:17px;font-weight:650;letter-spacing:-.005em;background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh);transition:transform .55s cubic-bezier(.25,1,.5,1),opacity .35s;transition:transform .55s linear(0,0.0154,0.0555,0.1128,0.1811,0.2555,0.3323,0.4086,0.4822,0.5518,0.6164,0.6753,0.7283,0.7755,0.8169,0.8529,0.8837,0.91,0.932,0.9502,0.9652,0.9773,0.9868,0.9943,1,1.0042,1.0072,1.0092,1.0104,1.011,1.0111,1.0108,1.0104,1.0097,1.0089,1.0081,1.0072,1.0064,1.0056,1.0048,1.0041,1.0035,1.0029,1),opacity .35s}
.cta[disabled]{opacity:.35;pointer-events:none}
.cta .sh{position:absolute;top:0;left:0;width:30%;height:100%;background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.85),rgba(255,255,255,0));mix-blend-mode:soft-light;animation:sweep 3.8s ease-in-out 1.4s infinite;pointer-events:none}
.ctaw{position:relative;border-radius:999px;padding:1.5px}
.ctaw::before{content:"";position:absolute;inset:-1px;border-radius:inherit;background:conic-gradient(from var(--a),transparent 0 70%,rgba(255,255,255,.75) 85%,transparent 98%);animation:spin 4.5s linear infinite;opacity:.55}
.light .ctaw::before{background:conic-gradient(from var(--a),transparent 0 70%,rgba(0,0,0,.45) 85%,transparent 98%)}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;flex-shrink:0;background:currentColor;box-shadow:0 0 10px currentColor}
.st{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;white-space:nowrap;border-radius:999px;padding:4px 10px;background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line);transition:color .4s}
.st.ok{color:var(--ok)}.st.late{color:var(--late)}.st.bad{color:var(--bad)}.st.idle{color:var(--idle)}
.ap{position:relative;box-sizing:border-box;border-radius:18px;padding:11px 14px 11px 20px;font-size:13px;background:linear-gradient(155deg,var(--gl1),var(--gl2));box-shadow:inset 0 1px 0 var(--ghi),inset 0 0 0 1px var(--line),0 16px 30px -18px rgba(0,0,0,.8);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.ap::before{content:"";position:absolute;left:9px;top:12px;bottom:12px;width:3px;border-radius:3px;background:var(--c,var(--idle));box-shadow:0 0 12px var(--c,transparent)}
.ap.ok{--c:var(--ok)}.ap.late{--c:var(--late)}.ap.bad{--c:var(--bad)}.ap.idle{--c:var(--idle)}
.ap.free{background:none;box-shadow:inset 0 0 0 1px var(--line);backdrop-filter:none;color:var(--t3)}
.ap.free::before{display:none}
.seg{position:relative;display:flex;border-radius:999px;padding:4px;background:var(--well);box-shadow:var(--wsh)}
.seg.segro{opacity:.55}
.seg-i{position:absolute;top:4px;bottom:4px;left:4px;border-radius:999px;background:var(--sel-bg);box-shadow:var(--sel-sh);transform-origin:center}
.seg button{flex:1;position:relative;z-index:1;padding:10px 8px;white-space:nowrap;font-size:14px;font-weight:600;color:var(--t2);transition:color .35s}
.seg button.sel{color:var(--sel-fg)}
.sw{display:inline-block;flex-shrink:0;width:50px;height:30px;border-radius:99px;position:relative;background:var(--well);box-shadow:var(--wsh);transition:background .35s,box-shadow .35s;cursor:pointer}
.sw::after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:linear-gradient(180deg,#fff,#d8d3cc);box-shadow:0 3px 8px rgba(0,0,0,.45);transition:left .55s cubic-bezier(.34,1.45,.55,1),width .3s;transition:left .55s linear(0,0.0286,0.1027,0.2063,0.3262,0.4515,0.574,0.6877,0.7888,0.875,0.9456,1.0007,1.0413,1.0692,1.086,1.0937,1.0943,1.0896,1.0813,1.0707,1.059,1.0471,1.0358,1.0255,1.0165,1.0089,1.0028,0.9982,0.9949,0.9927,0.9915,0.991,0.9912,0.9918,0.9927,0.9938,0.9949,0.996,0.997,0.998,0.9988,0.9994,0.9999,1),width .3s}
.sw:active::after{width:30px}
.sw.on{background:var(--sel-bg);box-shadow:inset 0 1px 3px rgba(80,60,40,.35),0 0 18px rgba(243,238,231,.2)}
.sw.on::after{left:23px;background:linear-gradient(180deg,#1a1a1a,#000)}
.sw.on:active::after{left:17px}
.light .sw.on::after{background:linear-gradient(180deg,#fff,#e6e1da)}
.list{border-radius:22px;overflow:hidden}
.li{position:relative;display:flex;align-items:center;gap:12px;padding:14px 16px;min-height:24px;font-size:16px}
.li+.li::before{content:"";position:absolute;left:16px;right:0;top:0;height:1px;background:var(--sep)}
.li .k{color:var(--t2);flex-shrink:0}.li .v{margin-left:auto;text-align:right;font-weight:600;min-width:0}
.hair{height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent)}
.row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.dock{position:absolute;left:16px;top:16px;bottom:16px;width:212px;border-radius:28px;padding:24px 14px;display:flex;flex-direction:column;gap:6px}
.nv{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:999px;color:var(--t2);font-size:14px;font-weight:500}
.nv i{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.5}
.nv.on{color:var(--sel-fg);font-weight:700;background:var(--sel-bg);box-shadow:var(--sel-sh)}
.nv.on i{opacity:1}
.me{margin-top:auto;font-size:12px;color:var(--t3);padding:0 12px;line-height:1.5}
.main{position:absolute;left:244px;right:16px;top:16px;bottom:16px;display:flex;flex-direction:column;gap:14px}
.kpi{padding:16px 18px;border-radius:24px}
.kpi .l{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--t3);display:flex;align-items:center;gap:8px;font-weight:600}
.kpi .v{font-size:32px;font-weight:700;letter-spacing:-.03em;margin-top:8px}
.kpi .s{font-size:12px;color:var(--t3)}
.av{border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;letter-spacing:.04em;flex-shrink:0}

@keyframes spArm{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes spSpark{0%{opacity:0;transform:scale(.2)}35%{opacity:1;transform:scale(1.15)}100%{opacity:0;transform:scale(1.9)}}
@keyframes spGlow{0%{opacity:0}40%{opacity:.85}100%{opacity:.16}}
@keyframes spP{from{opacity:0;transform:translateX(110px);filter:blur(10px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes spYT{from{opacity:0;transform:translateX(-110px);filter:blur(10px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes spShine{from{transform:translateX(0) skewX(-18deg)}to{transform:translateX(980px) skewX(-18deg)}}
@keyframes spTag{from{opacity:0;letter-spacing:.1em;filter:blur(4px)}to{opacity:1;letter-spacing:.42em;filter:blur(0)}}
.sp-arm{stroke-dasharray:1;stroke-dashoffset:1;animation:spArm .78s cubic-bezier(.65,0,.3,1) .2s forwards}
.sp-spark{opacity:0;transform-box:fill-box;transform-origin:center;animation:spSpark .9s ease-out .9s forwards}
.sp-glow{animation:spGlow 1.6s ease-out .85s forwards}
.sp-l{opacity:0}
.sp-p{animation:spP .85s cubic-bezier(.2,.8,.2,1) 1.08s forwards}
.sp-y{animation:spYT .85s cubic-bezier(.2,.8,.2,1) 1.14s forwards}
.sp-t{animation:spYT .85s cubic-bezier(.2,.8,.2,1) 1.22s forwards}
.sp-shine{animation:spShine 1.1s cubic-bezier(.5,0,.3,1) 1.85s forwards}
.sp-tag{font-family:var(--f-head);letter-spacing:.3em;opacity:0;animation:spTag 1.1s cubic-bezier(.2,.8,.2,1) 1.7s forwards}

:root{color-scheme:dark;--page:#020202}
html,body{height:100%}
body{background:var(--page);color:var(--fg);overflow:hidden}
.app{position:relative;height:100%;max-width:440px;margin:0 auto;overflow:hidden;overflow:clip;isolation:isolate}
@media (min-width:600px) and (min-height:700px){html:not(.in-tg) .app{height:calc(100% - 32px);margin:16px auto;border-radius:44px;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 40px 120px -20px rgba(0,0,0,.9)}}
.screen{position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden;background:radial-gradient(120% 70% at 50% -12%,var(--bg0) 0%,var(--bg1) 55%,var(--bg2) 100%);transform:translateX(100%);transition:transform .56s cubic-bezier(.32,.72,0,1),border-radius .5s cubic-bezier(.32,.72,0,1),filter .5s;z-index:1;box-shadow:-24px 0 50px rgba(0,0,0,.45)}
.screen.active{transform:none;z-index:3}
.screen.under{transform:translateX(-28%);z-index:2}
.screen.leaving{z-index:4}
.screen::after{content:"";position:absolute;inset:0;background:#000;opacity:0;pointer-events:none;transition:opacity .56s;z-index:50}
.screen.under::after{opacity:.45}
.app.modal .screen.active{transform:scale(.915) translateY(12px);border-radius:34px;filter:brightness(.62) saturate(.85)}
/* под открытой шторкой видна только текущая карточка: экраны сбоку и сзади не выглядывают по краям, их тень тоже */
.screen:not(.active):not(.under):not(.leaving){box-shadow:none}
.app.modal .screen:not(.active):not(.leaving){visibility:hidden}
.screen:not(.active) .orb{animation-play-state:paused}
.scroll{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior:contain}
.scroll::-webkit-scrollbar{display:none}
.pad{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.stack{display:flex;flex-direction:column;gap:14px;padding-block:calc(64px + max(env(safe-area-inset-top,0px),var(--tgtop,0px))) 150px}
.navbar{position:absolute;top:0;left:0;right:0;z-index:20;padding-top:max(env(safe-area-inset-top,0px),var(--tgtop,0px));--p:0}
.navbar::before{content:"";position:absolute;inset:0;background:var(--mat);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);box-shadow:inset 0 -1px 0 var(--matline);opacity:var(--p)}
.navrow{position:relative;height:56px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.navtitle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) translateY(calc((1 - var(--p)) * 8px));font-size:17px;font-weight:650;opacity:var(--p);pointer-events:none;white-space:nowrap}
.navlogo{display:flex;color:var(--fg)}
.bbar{position:absolute;left:0;right:0;bottom:0;z-index:20;padding-bottom:env(safe-area-inset-bottom,0px)}
.bbar::before{content:"";position:absolute;inset:0;top:-26px;background:var(--mat);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);-webkit-mask:linear-gradient(to bottom,transparent,#000 26px);mask:linear-gradient(to bottom,transparent,#000 26px)}
.bbar-in{position:relative;display:flex;align-items:center;gap:14px;padding-block:10px 16px}
.sum{flex:1;min-width:0}
.sum1{font-size:13px;color:var(--t2);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity .18s}
.sum2{font-size:21px;font-weight:700;letter-spacing:-.01em;display:flex;align-items:baseline;gap:4px;margin-top:2px;white-space:nowrap}
.sum2 .t3{font-size:14px;font-weight:500;letter-spacing:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sum2{overflow:hidden}
.bbar .ctaw{flex-shrink:0}
.bbar .cta{width:auto;padding:16px 22px 16px 26px}
.roll{display:inline-flex;font-variant-numeric:tabular-nums;white-space:pre}
.rd{display:inline-block;height:1.2em;overflow:hidden}
.rs{display:flex;flex-direction:column;transition:transform .75s cubic-bezier(.34,1.45,.55,1);transition:transform .75s linear(0,0.0286,0.1027,0.2063,0.3262,0.4515,0.574,0.6877,0.7888,0.875,0.9456,1.0007,1.0413,1.0692,1.086,1.0937,1.0943,1.0896,1.0813,1.0707,1.059,1.0471,1.0358,1.0255,1.0165,1.0089,1.0028,0.9982,0.9949,0.9927,0.9915,0.991,0.9912,0.9918,0.9927,0.9938,0.9949,0.996,0.997,0.998,0.9988,0.9994,0.9999,1)}
.rs span{display:block;height:1.2em;line-height:1.2em;text-align:center}
.rc{display:inline-block;line-height:1.2em}
.hero{padding:6px 2px 2px}
.meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:14px;color:var(--t2);margin-top:10px}
.meta .ic{display:inline-flex;align-items:center;gap:5px}
.quick{width:100%;display:flex;align-items:center;gap:14px;padding:14px 14px 14px 20px;border-radius:28px;text-align:left;color:var(--fg)}
.qt{font-family:var(--f-head);font-size:30px;font-weight:300;letter-spacing:-.02em;line-height:1.1}
.cap{font-family:var(--f-head);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--t2);font-weight:500}
.masters{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;margin:0 calc(-1 * max(16px,env(safe-area-inset-left,0px)));padding:4px max(16px,env(safe-area-inset-left,0px)) 6px;scroll-snap-type:x mandatory}
.masters::-webkit-scrollbar{display:none}
.mst{flex-shrink:0;width:104px;display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 6px 12px;border-radius:26px;scroll-snap-align:start;color:var(--fg)}
.mst .avw{position:relative;width:62px;height:62px}
.mst .av{position:absolute;inset:6px;font-size:15px;background:linear-gradient(160deg,var(--gl1),var(--gl2));box-shadow:inset 0 1px 0 var(--ghi),inset 0 0 0 1px var(--line);transition:background .4s,color .4s,box-shadow .4s}
.mst.sel .av{background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh)}
.mst svg.ring{position:absolute;inset:0;transform:rotate(-90deg)}
.mst svg.ring circle{fill:none;stroke:var(--fg);stroke-width:1.5;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .8s cubic-bezier(.6,0,.2,1)}
.mst.sel svg.ring circle{stroke-dashoffset:0}
.mst .nm{font-size:14px;font-weight:650}
.mst .rl{font-size:11.5px;color:var(--t3);margin-top:-5px}
.svcs{display:flex;flex-direction:column;gap:10px}
.svc{width:100%;display:flex;align-items:center;gap:12px;padding:16px 16px 16px 18px;text-align:left;color:var(--fg)}
.svc .sthumb{flex-shrink:0;width:52px;height:52px;border-radius:15px;display:flex;align-items:center;justify-content:center;color:var(--t3);background:linear-gradient(155deg,var(--gl1),var(--gl2)) center/cover no-repeat;box-shadow:inset 0 0 0 1px var(--line)}
.svc .nm{display:block;font-weight:650;font-size:16px;overflow-wrap:break-word}
.svc .du{display:block;font-size:13px;color:var(--t3);margin-top:3px}
.svc .ds{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13px;line-height:1.42;color:var(--t2);margin-top:6px;transition:color .3s}
.svc.sel .ds{-webkit-line-clamp:12;color:var(--fg);opacity:.82}
.svc .pr{display:block;margin-top:5px;font-weight:700;font-size:15.5px;font-variant-numeric:tabular-nums;white-space:nowrap}
.svc.sel{box-shadow:inset 0 0 0 1.5px var(--fg),inset 0 1px 0 var(--ghi),0 26px 50px -26px rgba(0,0,0,.95);transform:scale(1.012)}
.ck{width:26px;height:26px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:transparent;box-shadow:inset 0 0 0 1.5px var(--line);transform:scale(.85);transition:transform .55s cubic-bezier(.34,1.45,.55,1),background .3s,color .3s,box-shadow .3s;transition:transform .55s linear(0,0.0286,0.1027,0.2063,0.3262,0.4515,0.574,0.6877,0.7888,0.875,0.9456,1.0007,1.0413,1.0692,1.086,1.0937,1.0943,1.0896,1.0813,1.0707,1.059,1.0471,1.0358,1.0255,1.0165,1.0089,1.0028,0.9982,0.9949,0.9927,0.9915,0.991,0.9912,0.9918,0.9927,0.9938,0.9949,0.996,0.997,0.998,0.9988,0.9994,0.9999,1),background .3s,color .3s,box-shadow .3s}
.svc.sel .ck{background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh);transform:none}
.days{padding:6px;border-radius:26px}
.days .seg-i{top:6px;bottom:6px;left:6px;border-radius:20px}
.days button{padding:9px 0;border-radius:20px}
.days .wk{display:block;font-size:11px;font-weight:500;opacity:.72}
.days .dn{display:block;font-size:18px;font-weight:700;margin-top:2px;font-variant-numeric:tabular-nums}
.tgroup{display:flex;flex-direction:column;gap:8px}
.tgroup+.tgroup{margin-top:8px}
.tg-h{font-size:12.5px;color:var(--t3);font-weight:600;padding-left:4px}
.slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.slot{padding:13px 0;font-size:15px;color:var(--t2);font-weight:500;font-variant-numeric:tabular-nums;font-family:var(--f-head);font-size:13.5px;font-weight:300}
.slot.sel{background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh);transform:scale(1.05);font-weight:500}
.slot:disabled{color:var(--t3);font-weight:400;text-decoration:line-through;box-shadow:none;background:none;cursor:default}
.wave .slot{animation:rise .5s cubic-bezier(.2,.8,.2,1) var(--d,0s) backwards}
#home.enter .dz{animation:depthIn 1s cubic-bezier(.22,1,.36,1) var(--d,0s) backwards;animation:depthIn 1s linear(0,0.0171,0.0603,0.1196,0.1879,0.26,0.3323,0.4025,0.469,0.5309,0.5877,0.6392,0.6854,0.7267,0.7633,0.7956,0.8239,0.8486,0.8701,0.8888,0.905,0.9189,0.9309,0.9412,0.95,0.9576,0.964,0.9695,0.9742,0.9782,0.9816,0.9845,0.9869,0.9889,0.9907,0.9922,0.9934,0.9945,0.9953,0.9961,0.9967,0.9972,0.9977,1) var(--d,0s) backwards}
.empty-slots{padding:18px;text-align:center;color:var(--t3);font-size:14px;border-radius:20px;box-shadow:inset 0 0 0 1px var(--line)}
.clock{padding:4px 4px 2px}
.clockT{display:inline-block;font-size:80px;font-weight:200;letter-spacing:-.05em;line-height:.95;font-variant-numeric:tabular-nums}
.ta{display:block;width:100%;box-sizing:border-box;min-height:54px;resize:none;border:0;outline:0;border-radius:18px;padding:15px 16px;font-size:16px;color:var(--fg);background:var(--well);box-shadow:var(--wsh);line-height:1.4}
.ta::placeholder,.inp::placeholder{color:var(--t3)}
.ta:focus,.inp:focus{box-shadow:var(--wsh),0 0 0 1.5px var(--t3)}
.expand{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s cubic-bezier(.25,1,.5,1);transition:grid-template-rows .55s linear(0,0.0154,0.0555,0.1128,0.1811,0.2555,0.3323,0.4086,0.4822,0.5518,0.6164,0.6753,0.7283,0.7755,0.8169,0.8529,0.8837,0.91,0.932,0.9502,0.9652,0.9773,0.9868,0.9943,1,1.0042,1.0072,1.0092,1.0104,1.011,1.0111,1.0108,1.0104,1.0097,1.0089,1.0081,1.0072,1.0064,1.0056,1.0048,1.0041,1.0035,1.0029,1)}
.expand>div{overflow:hidden;min-height:0}
.expand.open{grid-template-rows:1fr}
.inp{width:100%;box-sizing:border-box;border:0;outline:0;border-radius:14px;padding:13px 14px;font-size:16px;color:var(--fg);background:var(--well);box-shadow:var(--wsh)}
.linkbtn{color:var(--fg);font-weight:600;font-size:15px;opacity:.9}
.note{font-size:12.5px;line-height:1.5;color:var(--t3);padding:0 4px}
.foot{position:absolute;left:0;right:0;bottom:0;z-index:20;padding-bottom:env(safe-area-inset-bottom,0px)}
.foot::before{content:"";position:absolute;inset:0;top:-26px;background:var(--mat);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);-webkit-mask:linear-gradient(to bottom,transparent,#000 26px);mask:linear-gradient(to bottom,transparent,#000 26px)}
.foot-in{position:relative;padding-block:10px 16px}
#bookWrap{width:100%;margin:0 auto;transition:width .7s cubic-bezier(.7,0,.2,1)}
.busy #bookWrap{width:60px}
#bookBtn{height:57px;padding:0}
#bookBtn .lbl{transition:opacity .2s}
.busy #bookBtn .lbl{opacity:0}
.pring{position:absolute;left:50%;top:50%;width:40px;height:40px;margin:-20px 0 0 -20px;opacity:0;transition:opacity .25s;transform:rotate(-90deg)}
.pring circle{fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round}
.pring .bg{opacity:.15}
.pring .p{stroke-dasharray:1;stroke-dashoffset:1}
.busy .pring{opacity:1}
.busy .pring .p{animation:drawc 1.05s cubic-bezier(.55,0,.25,1) .4s forwards}
.ok .pring{opacity:0}
.okc{position:absolute;opacity:0}
.okc path{stroke-dasharray:1;stroke-dashoffset:1}
.ok .okc{opacity:1}
.ok .okc path{animation:drawc .45s ease-out forwards}
.shake{animation:shake .45s cubic-bezier(.36,.07,.19,.97)}
@keyframes shake{10%,90%{transform:translateX(-2px)}20%,80%{transform:translateX(4px)}30%,50%,70%{transform:translateX(-7px)}40%,60%{transform:translateX(7px)}}
.backdrop{position:absolute;inset:0;z-index:40;background:var(--dim);opacity:0;pointer-events:none;transition:opacity .5s}
.app.modal .backdrop{opacity:1;pointer-events:auto}
.sheet{position:absolute;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom,0px));z-index:45;border-radius:40px;padding:12px 20px 18px;display:flex;flex-direction:column;align-items:center;gap:14px;background:var(--sheet);backdrop-filter:blur(30px) saturate(160%);-webkit-backdrop-filter:blur(30px) saturate(160%);box-shadow:inset 0 1px 0 var(--ghi),inset 0 0 0 1px var(--line),0 -10px 60px rgba(0,0,0,.45);transform:translateY(calc(100% + 40px));transition:transform .8s cubic-bezier(.34,1.45,.55,1);transition:transform .8s linear(0,0.0286,0.1027,0.2063,0.3262,0.4515,0.574,0.6877,0.7888,0.875,0.9456,1.0007,1.0413,1.0692,1.086,1.0937,1.0943,1.0896,1.0813,1.0707,1.059,1.0471,1.0358,1.0255,1.0165,1.0089,1.0028,0.9982,0.9949,0.9927,0.9915,0.991,0.9912,0.9918,0.9927,0.9938,0.9949,0.996,0.997,0.998,0.9988,0.9994,0.9999,1);max-height:calc(100% - 60px);overflow-y:auto;box-sizing:border-box}
.sheet.open{transform:none}
/* закрытые шторки стоят чуть ниже экрана — без внешней тени, иначе она тёмным пятном лезет на низ экрана */
.sheet:not(.open){box-shadow:inset 0 1px 0 var(--ghi),inset 0 0 0 1px var(--line)}
.grab{width:38px;height:5px;border-radius:3px;background:var(--line);flex-shrink:0}
.medal{position:relative;width:90px;height:90px;margin-top:8px;flex-shrink:0}
.medal .core{position:absolute;inset:0;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh);transform:scale(.3);opacity:0;transition:transform .9s cubic-bezier(.34,1.45,.55,1) .3s,opacity .3s .3s;transition:transform .9s linear(0,0.0286,0.1027,0.2063,0.3262,0.4515,0.574,0.6877,0.7888,0.875,0.9456,1.0007,1.0413,1.0692,1.086,1.0937,1.0943,1.0896,1.0813,1.0707,1.059,1.0471,1.0358,1.0255,1.0165,1.0089,1.0028,0.9982,0.9949,0.9927,0.9915,0.991,0.9912,0.9918,0.9927,0.9938,0.9949,0.996,0.997,0.998,0.9988,0.9994,0.9999,1) .3s,opacity .3s .3s}
.sheet.open .medal .core{transform:none;opacity:1}
.medal .core path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .6s ease-out .8s}
.sheet.open .medal .core path{stroke-dashoffset:0}
.rip{position:absolute;inset:0;border-radius:50%;border:1px solid var(--t3);opacity:0}
.sheet.open .rip{animation:ripple2 2.6s ease-out .9s infinite}@keyframes ripple2{0%{transform:scale(.8);opacity:.55}100%{transform:scale(1.75);opacity:0}}
.sheet.open .rip+.rip{animation-delay:2.2s}
.burst{position:absolute;left:50%;top:50%;width:0;height:0;pointer-events:none;z-index:3;color:var(--fg)}
.burst i{position:absolute;left:-8px;top:-5px;width:16px;height:10px;background:currentColor;clip-path:polygon(0 100%,50% 0,100% 100%,78% 100%,50% 40%,22% 100%)}
.ringw{position:relative;width:48px;height:48px;flex-shrink:0}
.ringw svg,.ring-big svg{transform:rotate(-90deg);display:block}
.ringw circle,.ring-big circle{fill:none;stroke-width:3.5;stroke-linecap:round}
.rbg{stroke:var(--line)}
.rfg{stroke:var(--fg);stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.4s cubic-bezier(.5,0,.2,1)}
.live-mini{width:100%;box-sizing:border-box;display:flex;align-items:center;gap:14px;padding:12px 16px 12px 12px;border-radius:24px;background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line);text-align:left}
.live{padding:18px 18px 16px;display:flex;flex-direction:column;gap:14px;border-radius:30px}
.lvTime{font-size:58px;font-weight:200;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums}
.ring-big{position:relative;width:80px;height:80px;flex-shrink:0}
.ring-t{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.1}
.ring-t b{font-size:17px;font-weight:650}.ring-t span{font-size:11px;color:var(--t3)}
.st4 button{font-size:13px;padding:10px 0}
.chips{display:flex;gap:8px;padding-top:2px}
.chips .pill{flex:1}
.island{position:absolute;z-index:95;top:calc(10px + max(env(safe-area-inset-top,0px),var(--tgtop,0px)));left:50%;height:38px;display:flex;align-items:center;gap:9px;padding:0 16px 0 9px;border-radius:999px;background:#000;color:#fff;box-shadow:0 12px 30px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,255,255,.1);font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;box-sizing:border-box;max-width:38px;opacity:0;transform:translateX(-50%) scale(.6);transition:max-width .75s cubic-bezier(.34,1.45,.55,1),opacity .25s,transform .6s cubic-bezier(.34,1.45,.55,1);transition:max-width .75s linear(0,0.0286,0.1027,0.2063,0.3262,0.4515,0.574,0.6877,0.7888,0.875,0.9456,1.0007,1.0413,1.0692,1.086,1.0937,1.0943,1.0896,1.0813,1.0707,1.059,1.0471,1.0358,1.0255,1.0165,1.0089,1.0028,0.9982,0.9949,0.9927,0.9915,0.991,0.9912,0.9918,0.9927,0.9938,0.9949,0.996,0.997,0.998,0.9988,0.9994,0.9999,1),opacity .25s,transform .6s linear(0,0.0286,0.1027,0.2063,0.3262,0.4515,0.574,0.6877,0.7888,0.875,0.9456,1.0007,1.0413,1.0692,1.086,1.0937,1.0943,1.0896,1.0813,1.0707,1.059,1.0471,1.0358,1.0255,1.0165,1.0089,1.0028,0.9982,0.9949,0.9927,0.9915,0.991,0.9912,0.9918,0.9927,0.9938,0.9949,0.996,0.997,0.998,0.9988,0.9994,0.9999,1);pointer-events:none}
.island.show{max-width:360px;opacity:1;transform:translateX(-50%) scale(1)}
.isl-ic{width:20px;height:20px;border-radius:50%;background:#f3eee6;color:#000;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.isl-tx{opacity:0;transition:opacity .3s .12s}
.island.show .isl-tx{opacity:1}
.menu{position:absolute;z-index:55;top:calc(58px + max(env(safe-area-inset-top,0px),var(--tgtop,0px)));right:max(16px,env(safe-area-inset-right,0px));width:244px;border-radius:24px;padding:6px;background:var(--sheet);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);box-shadow:inset 0 1px 0 var(--ghi),inset 0 0 0 1px var(--line),0 30px 60px -20px rgba(0,0,0,.7);transform-origin:top right;transform:scale(.5);opacity:0;pointer-events:none;transition:transform .55s cubic-bezier(.34,1.45,.55,1),opacity .2s;transition:transform .55s linear(0,0.0286,0.1027,0.2063,0.3262,0.4515,0.574,0.6877,0.7888,0.875,0.9456,1.0007,1.0413,1.0692,1.086,1.0937,1.0943,1.0896,1.0813,1.0707,1.059,1.0471,1.0358,1.0255,1.0165,1.0089,1.0028,0.9982,0.9949,0.9927,0.9915,0.991,0.9912,0.9918,0.9927,0.9938,0.9949,0.996,0.997,0.998,0.9988,0.9994,0.9999,1),opacity .2s}
.menu.open{transform:none;opacity:1;pointer-events:auto}
.mi{width:100%;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 14px;border-radius:18px;font-size:15.5px;font-weight:500;color:var(--fg);text-align:left}
.mi+.mi{box-shadow:inset 0 1px 0 var(--sep)}
.fly{position:absolute;inset:0;z-index:90;pointer-events:none;color:var(--fg)}
.splash{position:absolute;inset:0;z-index:80;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;background:radial-gradient(120% 70% at 50% -12%,var(--bg0) 0%,var(--bg1) 55%,var(--bg2) 100%);color:var(--fg);cursor:pointer;transition:opacity .7s ease .1s}
.splash.out{opacity:0;pointer-events:none}
/* часы заставки для звука (early.js): бесконечная анимация без вида — у неё всегда есть время старта */
.sp-clock{position:absolute;width:0;height:0;overflow:hidden;animation:spClock 1s linear infinite}
@keyframes spClock{to{opacity:1}}

.scene{--ring:rgba(255,255,255,.75);--shine:#fff;--spark:#fff}
.scene.light{--ring:rgba(0,0,0,.45);--shine:rgba(255,255,255,.95);--spark:#cdbba3}
.t-pearl .ctaw::before,.t-clinic .ctaw::before{background:conic-gradient(from var(--a),transparent 0 70%,var(--ring) 85%,transparent 98%)}
/* Жемчуг — тёмный */
.scene.t-pearl{--bg0:#2b1e21;--bg1:#150f11;--bg2:#0b0809;--fg:#fff4f1;--t2:rgba(255,240,236,.72);--t3:rgba(255,236,230,.56);--line:rgba(255,226,218,.12);--sep:rgba(255,226,218,.09);
--gl1:rgba(255,232,226,.12);--gl2:rgba(255,232,226,.03);--gl3:rgba(255,232,226,.07);--rim1:rgba(255,226,216,.6);--rim2:rgba(255,226,216,.05);--rim3:rgba(240,180,200,.3);
--ghi:rgba(255,236,230,.24);--gsh:0 30px 60px -30px rgba(0,0,0,.95);--mat:rgba(22,14,16,.68);--matline:rgba(255,226,218,.08);
--sel-bg:linear-gradient(180deg,#f8dcd2,#e3a796);--sel-fg:#2b1310;--sel-sh:inset 0 1px 0 rgba(255,255,255,.8),inset 0 -8px 14px -8px rgba(150,70,55,.45),0 12px 30px -10px rgba(240,170,150,.45);
--well:rgba(0,0,0,.3);--wsh:inset 0 1px 3px rgba(0,0,0,.55),inset 0 -1px 0 rgba(255,226,218,.1);--orbA:rgba(240,165,150,.22);--orbB:rgba(205,165,235,.17);--orbC:rgba(255,220,205,.1);
--ok:#a8e6c4;--late:#f1c99a;--bad:#ff9fae;--idle:rgba(255,236,230,.55);--glow:rgba(255,215,205,.22);--sheet:linear-gradient(165deg,rgba(58,42,45,.93),rgba(22,15,17,.96));--dim:rgba(0,0,0,.42);
--ring:rgba(248,210,198,.85);--shine:#ffe9e2;--spark:#f6c9bc}
/* Жемчуг — светлый */
.scene.t-pearl.light{--bg0:#fffaf8;--bg1:#f9eeea;--bg2:#f2e3de;--fg:#2c1f1d;--t2:rgba(44,31,29,.68);--t3:rgba(44,31,29,.58);--line:rgba(90,50,40,.1);--sep:rgba(90,50,40,.08);
--gl1:rgba(255,255,255,.9);--gl2:rgba(255,255,255,.6);--gl3:rgba(255,255,255,.75);--rim1:#fff;--rim2:rgba(255,255,255,.35);--rim3:rgba(200,140,130,.18);
--ghi:rgba(255,255,255,.95);--gsh:0 24px 50px -28px rgba(140,80,70,.32);--mat:rgba(255,249,247,.76);--matline:rgba(90,50,40,.07);
--sel-bg:linear-gradient(180deg,#d8987f,#b86c58);--sel-fg:#fff;--sel-sh:inset 0 1px 0 rgba(255,255,255,.5),0 12px 26px -10px rgba(190,110,90,.55);
--well:rgba(120,60,50,.05);--wsh:inset 0 1px 2px rgba(90,40,30,.08),inset 0 0 0 1px rgba(90,40,30,.06);--orbA:rgba(244,186,172,.55);--orbB:rgba(255,255,255,.9);--orbC:rgba(214,186,240,.4);
--ok:#23935a;--late:#b2741f;--bad:#cf3f55;--idle:rgba(44,31,29,.45);--glow:rgba(207,138,119,.18);--sheet:linear-gradient(165deg,rgba(255,255,255,.96),rgba(250,240,236,.97));--dim:rgba(60,30,25,.18);
--ring:rgba(207,138,119,.7);--shine:#fff;--spark:#e9b6a6}
/* Клиника — тёмная */
.scene.t-clinic{--bg0:#10252b;--bg1:#081519;--bg2:#040b0e;--fg:#effbfc;--t2:rgba(230,248,250,.72);--t3:rgba(225,245,248,.56);--line:rgba(200,240,245,.11);--sep:rgba(200,240,245,.085);
--gl1:rgba(225,250,252,.11);--gl2:rgba(225,250,252,.03);--gl3:rgba(225,250,252,.065);--rim1:rgba(220,250,252,.55);--rim2:rgba(220,250,252,.05);--rim3:rgba(120,220,215,.3);
--ghi:rgba(225,250,252,.22);--gsh:0 30px 60px -30px rgba(0,0,0,.95);--mat:rgba(8,20,24,.7);--matline:rgba(200,240,245,.08);
--sel-bg:linear-gradient(180deg,#9ff0e8,#4fc3bc);--sel-fg:#032421;--sel-sh:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -8px 14px -8px rgba(20,110,105,.45),0 12px 30px -10px rgba(90,210,200,.4);
--well:rgba(0,0,0,.3);--wsh:inset 0 1px 3px rgba(0,0,0,.55),inset 0 -1px 0 rgba(200,240,245,.1);--orbA:rgba(80,205,200,.18);--orbB:rgba(95,150,255,.13);--orbC:rgba(200,250,250,.07);
--ok:#9be8c0;--late:#efcd94;--bad:#ff9d9d;--idle:rgba(225,245,248,.55);--glow:rgba(150,235,228,.2);--sheet:linear-gradient(165deg,rgba(28,52,58,.93),rgba(8,20,24,.96));--dim:rgba(0,0,0,.42);
--ring:rgba(150,235,228,.85);--shine:#e6fffc;--spark:#9ff0e8}
/* Клиника — светлая */
.scene.t-clinic.light{--bg0:#ffffff;--bg1:#f1f7f8;--bg2:#e6f0f2;--fg:#0e2a32;--t2:rgba(14,42,50,.68);--t3:rgba(14,42,50,.58);--line:rgba(14,60,70,.09);--sep:rgba(14,60,70,.075);
--gl1:rgba(255,255,255,.92);--gl2:rgba(255,255,255,.62);--gl3:rgba(255,255,255,.78);--rim1:#fff;--rim2:rgba(255,255,255,.35);--rim3:rgba(60,140,150,.15);
--ghi:rgba(255,255,255,.95);--gsh:0 24px 50px -28px rgba(30,90,100,.28);--mat:rgba(250,253,253,.78);--matline:rgba(14,60,70,.07);
--sel-bg:linear-gradient(180deg,#3db8b1,#21958f);--sel-fg:#fff;--sel-sh:inset 0 1px 0 rgba(255,255,255,.35),0 12px 26px -10px rgba(30,150,145,.5);
--well:rgba(14,60,70,.045);--wsh:inset 0 1px 2px rgba(14,60,70,.08),inset 0 0 0 1px rgba(14,60,70,.06);--orbA:rgba(120,212,222,.42);--orbB:rgba(255,255,255,.95);--orbC:rgba(160,198,255,.32);
--ok:#1b9455;--late:#b4761b;--bad:#cf3d3d;--idle:rgba(14,42,50,.45);--glow:rgba(33,149,143,.14);--sheet:linear-gradient(165deg,rgba(255,255,255,.97),rgba(242,248,249,.98));--dim:rgba(10,40,50,.16);
--ring:rgba(33,149,143,.6);--shine:#fff;--spark:#7fd6cf}
.burst i.pearl{left:-6px;top:-6px;width:12px;height:12px;border-radius:50%;clip-path:none;background:radial-gradient(circle at 35% 30%,#fff,var(--spark) 55%,rgba(0,0,0,.15));box-shadow:0 0 10px var(--glow)}
.burst i.drop{left:-3px;top:-3px;width:6px;height:6px;border-radius:50%;clip-path:none;background:var(--spark)}
.langbtn{gap:6px;padding:7px 12px 7px 10px;min-height:44px;font-size:12.5px;letter-spacing:.06em}.langbtn b{font-weight:700}
.lmenu{width:200px;right:calc(max(16px,env(safe-area-inset-right,0px)) + 46px)}
.lck{display:flex;opacity:0;transition:opacity .2s}.mi.cur .lck{opacity:1}.mi.cur{font-weight:700}
.thm{display:flex;gap:6px;padding:6px 8px 10px}
.thm button{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 4px;border-radius:16px;font-size:12.5px;font-weight:600;color:var(--t2)}
.thm button.on{background:var(--gl3);color:var(--fg);box-shadow:inset 0 0 0 1.5px var(--fg)}
.thm i{width:30px;height:30px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(128,128,128,.3)}

button:focus-visible,a:focus-visible{outline:2px solid var(--fg);outline-offset:3px}textarea:focus-visible,input:focus-visible{outline:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important;transition-delay:0s!important}.sp-l,.sp-tag{opacity:1!important}.sp-arm{stroke-dashoffset:0!important}}

/* ---------- добавлено для настоящего приложения ---------- */
.hidden{display:none!important}
.skel{position:relative;overflow:hidden;background:var(--gl3);border-radius:18px;min-height:56px}
.skel::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--ghi),transparent);animation:sweep 1.6s ease-in-out infinite}
.svc .sthumb img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
.err{padding:28px 20px;text-align:center;display:flex;flex-direction:column;gap:14px;align-items:center}
.err .h1{font-size:20px}
.mst .avw img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.tgnote{display:flex;align-items:center;gap:10px;padding:14px 16px;font-size:14px;line-height:1.4}
.live+.live{margin-top:12px}
.past-st{color:var(--t3)}
.gal{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px}
.gal::-webkit-scrollbar{display:none}
.gal img{height:120px;width:160px;object-fit:cover;border-radius:18px;flex-shrink:0}
.quick[disabled]{opacity:.55}

/* ---------- график работы (из design/build/graf4.py) ---------- */

.mhead{display:flex;align-items:center;justify-content:space-between;gap:10px}
.mtitle{font-size:26px;font-weight:700;letter-spacing:-.02em}
.mtitle span{color:var(--t3);font-weight:500}
.cal{padding:12px 10px 10px;border-radius:26px}
.wkh{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:6px}
.wkh button{font-size:11.5px;font-weight:600;color:var(--t3);padding:6px 0;border-radius:10px;letter-spacing:.04em}
.wkh button.we{color:var(--t2)}
.grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.dc{position:relative;aspect-ratio:.78;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:7px;gap:2px;font-variant-numeric:tabular-nums;color:var(--fg);background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line);transition:transform .45s cubic-bezier(.25,1,.5,1),background .3s,box-shadow .3s,color .3s;transition:transform .45s linear(0,0.0154,0.0555,0.1128,0.1811,0.2555,0.3323,0.4086,0.4822,0.5518,0.6164,0.6753,0.7283,0.7755,0.8169,0.8529,0.8837,0.91,0.932,0.9502,0.9652,0.9773,0.9868,0.9943,1,1.0042,1.0072,1.0092,1.0104,1.011,1.0111,1.0108,1.0104,1.0097,1.0089,1.0081,1.0072,1.0064,1.0056,1.0048,1.0041,1.0035,1.0029,1),background .3s,box-shadow .3s,color .3s;min-width:0}
.dc .n{font-size:15px;font-weight:650;line-height:1.1}
.dc .h{font-size:9.5px;color:var(--t2);letter-spacing:-.01em;white-space:nowrap}
/* часы с минутами («10:20–19:05») в клетку не помещаются — переносим на две строки */
.dc .h.hm{white-space:normal;line-height:1.05;font-size:9px;text-align:center}
.dc .bd{position:absolute;bottom:6px;left:0;right:0;display:flex;justify-content:center;gap:2px}
.dc .bd i{width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.55}
.dc.off{background:none;box-shadow:inset 0 0 0 1px var(--line);color:var(--t3)}
.dc.off .h{color:var(--t3)}
.dc.ovr::after{content:"";position:absolute;top:5px;right:5px;width:5px;height:5px;border-radius:50%;background:var(--late);box-shadow:0 0 6px var(--late)}
.dc.past{opacity:.38}
.dc.today{box-shadow:inset 0 0 0 1.5px var(--fg)}
.dc.sel{background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh);transform:scale(1.04)}
.dc.sel .h{color:inherit;opacity:.75}
.dc.empty{visibility:hidden}
.dc:active{transform:scale(.93)}
.legend{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;color:var(--t3);padding:4px 6px 0}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:10px;height:10px;border-radius:4px;display:inline-block}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.stats .g{padding:12px 14px;border-radius:20px}
.stats b{display:block;font-size:22px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.stats span{font-size:11.5px;color:var(--t3)}
.tools{display:flex;gap:8px;flex-wrap:wrap}
.tools .pill{flex:1 1 auto}
.pill.act{background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh)}
.sheet.tall{gap:12px;padding:10px 18px 16px}
.sheet.tall>*{flex-shrink:0}
.sh-title{align-self:stretch;display:flex;align-items:center;justify-content:space-between;gap:10px}
.sh-title b{font-size:21px;letter-spacing:-.01em}
.sh-row{align-self:stretch;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:16px;font-weight:600;padding:2px 2px}
.wrow{align-self:stretch;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.wgrp{position:relative;border-radius:22px;padding:8px 6px 6px;background:var(--well);box-shadow:var(--wsh)}
.wgrp .cap{text-align:center;display:block;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}   /* подпись в одну строку: иначе колёса соседей стоят на разной высоте */
.wpair{position:relative;display:flex;justify-content:center;align-items:center;gap:0}
.wpair .colon{font-size:19px;font-weight:300;color:var(--t2);width:10px;text-align:center;z-index:2}
.band{position:absolute;left:4px;right:4px;top:50%;height:32px;margin-top:-16px;border-radius:13px;background:var(--gl1);box-shadow:inset 0 0 0 1px var(--line);pointer-events:none}
.wh{position:relative;width:52px;height:128px;overflow-y:scroll;scroll-snap-type:y mandatory;scrollbar-width:none;-webkit-mask:linear-gradient(transparent,#000 30%,#000 70%,transparent);mask:linear-gradient(transparent,#000 30%,#000 70%,transparent);perspective:400px;overscroll-behavior:contain;touch-action:pan-y;z-index:1;outline:none}
.wh::-webkit-scrollbar{display:none}
.wh.w2{width:96px}
.wh .it{height:32px;line-height:32px;text-align:center;font-size:19px;font-weight:400;font-variant-numeric:tabular-nums;scroll-snap-align:center;color:var(--fg);transform-origin:50% 50%;will-change:transform,opacity;user-select:none;-webkit-user-select:none;cursor:pointer}
.wh.w2 .it{font-size:20px}
.wh .sp{height:48px}
.brkdur{font-size:13.5px;color:var(--t2);padding:8px 6px 0;min-height:1.4em}
.sh-foot{position:sticky;bottom:-16px;align-self:stretch;margin:0 -18px -16px;padding:14px 18px 16px;background:linear-gradient(to bottom,rgba(22,21,20,0),#161514 35%);z-index:3}
.light .sh-foot{background:linear-gradient(to bottom,rgba(246,243,238,0),#f6f3ee 35%)}
.wh:focus-visible{box-shadow:0 0 0 2px var(--fg);border-radius:12px}
.conf{align-self:stretch;display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.45;color:var(--late);background:var(--gl3);border-radius:16px;padding:10px 12px;box-shadow:inset 0 0 0 1px var(--line)}
.conf.okc2{color:var(--ok)}
.offnote{align-self:stretch;text-align:center;font-size:14px;color:var(--t2);padding:6px 10px 2px}
.selbar{display:flex;align-items:center;justify-content:space-between;gap:10px}
.mchips{display:flex;gap:8px}
.mchips .pill{padding:8px 14px}
.dlist{align-self:stretch;font-size:13px;color:var(--t2);text-align:left}

/* ---------- экраны сотрудников ---------- */
.jnode{display:flex;gap:12px}
.jnode .jt{width:44px;font-size:13px;font-weight:600;color:var(--t2);padding-top:12px;text-align:right;font-variant-numeric:tabular-nums;flex-shrink:0}
.jnode .jl{position:relative;width:14px;flex-shrink:0}
.jnode .jl i{position:absolute;left:6px;top:20px;bottom:-14px;width:1.5px;background:linear-gradient(180deg,var(--rim1),var(--line))}
.jnode.last .jl i{display:none}
.jnode .jl b{position:absolute;left:0;top:14px;width:14px;height:14px;border-radius:50%;background:var(--bg1);box-shadow:0 0 0 1.5px var(--c,var(--idle)),0 0 14px var(--c,transparent)}
.jnode.ok .jl b{--c:var(--ok)}.jnode.late .jl b{--c:var(--late)}.jnode.bad .jl b{--c:var(--bad)}.jnode.idle .jl b{--c:var(--idle)}
.jnode .ap{flex:1;text-align:left;cursor:pointer;min-width:0}
.jnode .ap b{font-size:14.5px;display:block}
.jnode .ap .t2{margin-top:3px;font-size:13px}
.jnode .ap .st{margin-top:8px}
.jnode .ap.free{padding:13px 16px;font-size:13px}
.jstats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.jstats .g{padding:10px 12px;border-radius:18px}
.jstats .g .t3{font-size:11px}
.jstats .g b{font-size:20px;font-weight:700;display:block;font-variant-numeric:tabular-nums}
.dnav{display:flex;align-items:center;gap:10px}
.dnav .h1{flex:1;min-width:0;font-size:22px}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chips .pill{padding:8px 14px;font-size:13.5px;min-height:40px}
.chips.scroll-x{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:2px 16px}
.chips.scroll-x .pill{flex:0 0 auto}
.sheet .seg{width:100%;box-sizing:border-box}
.chips.scroll-x::-webkit-scrollbar{display:none}
.chips.scroll-x .pill{flex-shrink:0}
.sheet.tall .inp{width:100%;box-sizing:border-box}
.fld{align-self:stretch;display:flex;flex-direction:column;gap:8px}
.fld .lab{padding-left:4px}
.vrow{align-self:stretch;display:flex;justify-content:space-between;gap:12px;font-size:15px;line-height:1.4}
.vrow .k{color:var(--t2);flex-shrink:0}
.vrow .v{text-align:right;font-weight:600;min-width:0;word-break:break-word}
.vbtns{align-self:stretch;display:flex;flex-direction:column;gap:10px}
.vbtns .row2{display:flex;gap:10px}
.vbtns .pill{flex:1;padding:14px}
.amt{font-size:32px;font-weight:700;letter-spacing:-.02em;text-align:center;font-variant-numeric:tabular-nums}
.amtw{align-self:stretch;display:flex;flex-direction:column;align-items:center;gap:4px}
.amtw input{background:none;border:0;outline:0;color:inherit;font:inherit;font-size:32px;font-weight:700;text-align:center;width:100%;letter-spacing:-.02em}

/* ---------- кабинет ---------- */
.mrow{display:flex;align-items:center;gap:12px;padding:14px 16px}
.mrow .ic{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line);flex-shrink:0;font-size:16px}
.mrow b{display:block;font-size:16px}.mrow .t3{display:block;font-size:12.5px;margin-top:2px}
.bar{height:6px;border-radius:3px;background:var(--gl3);overflow:hidden}.bar i{display:block;height:100%;border-radius:3px;background:var(--sel-bg)}
.gal .ph{position:relative;flex-shrink:0}.gal .ph img{height:96px;width:128px}.gal .ph button{position:absolute;top:6px;right:6px;width:24px;height:24px;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;font-size:14px;display:flex;align-items:center;justify-content:center}
.gal .ph button::before{content:"";position:absolute;inset:-10px}   /* зона нажатия 44px при значке 24px */
.gal .ph button.armed{background:var(--late,#e5484d);transform:scale(1.15)}
.gal .addph{height:96px;width:96px;border-radius:18px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;color:var(--t2);background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line)}
.inp[type=number]{-moz-appearance:textfield}.inp::-webkit-outer-spin-button,.inp::-webkit-inner-spin-button{-webkit-appearance:none}
.frow{display:flex;gap:10px}.frow .inp{flex:1;min-width:0}
.fl{font-size:12.5px;color:var(--t3);padding:0 4px;margin-bottom:-4px}
.li.cl{cursor:pointer}

/* ---------- регистрация салона (из design/build/biz4.py) ---------- */

.q{font-size:28px;font-weight:700;letter-spacing:-.02em;line-height:1.15}
.big-in{width:100%;box-sizing:border-box;border:0;outline:0;border-radius:20px;padding:18px 18px;font-size:22px;font-weight:600;color:var(--fg);background:var(--well);box-shadow:var(--wsh);letter-spacing:-.01em}
.big-in::placeholder{color:var(--t3);font-weight:500}
.big-in:focus{box-shadow:var(--wsh),0 0 0 1.5px var(--t3)}
.chips-w{display:flex;flex-wrap:wrap;gap:8px}
.chip{padding:10px 16px;font-size:14.5px;font-weight:550;color:var(--t2)}
.chip.on{color:var(--sel-fg);font-weight:650}
.info{display:flex;flex-wrap:wrap;gap:8px}
.cseg button{font-size:12.5px;padding:10px 0}
.srow{display:grid;grid-template-columns:1fr auto;gap:10px;padding:14px 14px 14px 16px;align-items:center}
.srow+.srow{border-top:1px solid var(--sep)}
.s-name{grid-column:1/2;border:0;outline:0;background:none;color:var(--fg);font-size:16px;font-weight:600;padding:0;min-width:0;width:100%}
.s-name::placeholder{color:var(--t3)}
.s-del{grid-column:2/3;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--t3);background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line)}
.s-meta{grid-column:1/3;display:flex;gap:8px;align-items:center}
.s-dur{appearance:none;-webkit-appearance:none;border:0;outline:0;border-radius:12px;padding:9px 12px;font-size:14px;color:var(--fg);background:var(--well);box-shadow:var(--wsh);font-family:inherit}
.s-price{flex:1;min-width:0;border:0;outline:0;border-radius:12px;padding:9px 12px;font-size:14px;color:var(--fg);background:var(--well);box-shadow:var(--wsh);text-align:right;font-variant-numeric:tabular-nums}
.s-price::placeholder{color:var(--t3)}
.s-cur{font-size:13px;color:var(--t3);min-width:44px}
.s-dw{grid-column:1/3;position:relative}
.s-desc{display:block;width:100%;box-sizing:border-box;min-height:58px;resize:none;border:0;outline:0;border-radius:14px;padding:12px 14px 22px;font-size:14.5px;line-height:1.4;color:var(--fg);background:var(--well);box-shadow:var(--wsh);font-family:inherit}
.s-desc::placeholder{color:var(--t3)}
.s-desc:focus{box-shadow:var(--wsh),0 0 0 1.5px var(--t3)}
.s-cnt{position:absolute;right:12px;bottom:6px;font-size:11px;color:var(--t3);font-variant-numeric:tabular-nums}
.srow.add{animation:rowIn .6s cubic-bezier(.25,1,.5,1) backwards;animation:rowIn .6s linear(0,0.0154,0.0555,0.1128,0.1811,0.2555,0.3323,0.4086,0.4822,0.5518,0.6164,0.6753,0.7283,0.7755,0.8169,0.8529,0.8837,0.91,0.932,0.9502,0.9652,0.9773,0.9868,0.9943,1,1.0042,1.0072,1.0092,1.0104,1.011,1.0111,1.0108,1.0104,1.0097,1.0089,1.0081,1.0072,1.0064,1.0056,1.0048,1.0041,1.0035,1.0029,1) backwards}
@keyframes rowIn{from{opacity:0;transform:translateY(-10px) scale(.97)}to{opacity:1;transform:none}}
.daysw{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.dbtn{aspect-ratio:1;border-radius:50%;font-size:14px;font-weight:650;color:var(--t2);padding:0;max-width:100%}
.dbtn.on{color:var(--sel-fg)}
.hours{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center}
.hcard{padding:14px 10px 12px;border-radius:22px;display:flex;flex-direction:column;align-items:center;gap:8px}
.hcard .tm{font-size:36px;font-weight:250;letter-spacing:-.03em;line-height:1.1}
.steps{display:flex;gap:10px}
.screen.active .dz{animation:depthIn .9s cubic-bezier(.22,1,.36,1) var(--d,0s) backwards;animation:depthIn .9s linear(0,0.0171,0.0603,0.1196,0.1879,0.26,0.3323,0.4025,0.469,0.5309,0.5877,0.6392,0.6854,0.7267,0.7633,0.7956,0.8239,0.8486,0.8701,0.8888,0.905,0.9189,0.9309,0.9412,0.95,0.9576,0.964,0.9695,0.9742,0.9782,0.9816,0.9845,0.9869,0.9889,0.9907,0.9922,0.9934,0.9945,0.9953,0.9961,0.9967,0.9972,0.9977,1) var(--d,0s) backwards}
.linkbox{width:100%;box-sizing:border-box;display:flex;align-items:center;gap:10px;padding:12px 12px 12px 16px;border-radius:20px;background:var(--well);box-shadow:var(--wsh)}
.linkbox input{flex:1;min-width:0;border:0;outline:0;background:none;color:var(--fg);font-size:14.5px;font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace}

.srow .s-name{font-family:inherit}
.srow .s-desc{font-family:inherit}

/* этап 2: отзывы и лист ожидания */
.stars{display:flex;gap:6px;justify-content:center;align-self:stretch;padding:4px 0}
.stars button{width:48px;height:48px;border-radius:50%;border:0;background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line);color:var(--t3);font-size:26px;line-height:1;display:flex;align-items:center;justify-content:center;transition:transform .35s cubic-bezier(.34,1.45,.55,1),color .3s,background .3s}
.stars button.on{color:var(--late);background:var(--sel-bg);transform:scale(1.08)}
.rv-stars{color:var(--late);letter-spacing:.08em;font-size:14px;white-space:nowrap}
.rv-stars .off{color:var(--t3);opacity:.55}
.rv{display:flex;flex-direction:column;gap:6px;padding:12px 14px;border-radius:18px;background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line)}
.rv .rv-reply{margin-top:4px;padding:8px 10px;border-radius:12px;background:var(--well);font-size:13.5px;line-height:1.4}
.ratelink{font-size:13px;color:var(--late);font-weight:600;background:none;border:0;padding:0;cursor:pointer}

/* акции */
.promo{display:flex;align-items:center;gap:12px;padding:12px 14px;text-align:left;width:100%;border:0;color:var(--fg);font:inherit}
.promo .pi{width:40px;height:40px;border-radius:14px;background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.promo b{display:block;font-size:15px}
.promo .t3{display:block;font-size:12.5px;margin-top:2px}
.promo .pd{font-size:17px;font-weight:700;letter-spacing:-.01em;flex-shrink:0}
.svc .pr .old,.sum2 .old{text-decoration:line-through;color:var(--t3);font-weight:500;font-size:.85em;margin-left:6px}
.svc .dc{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:999px;background:var(--sel-bg);color:var(--sel-fg);font-size:11px;font-weight:700;vertical-align:middle}
.slot .sl-d{display:block;font-size:9.5px;font-weight:700;line-height:1;margin-top:2px;color:var(--ok)}
.slot.sel .sl-d{color:inherit;opacity:.8}
.frow{display:flex;gap:10px;align-self:stretch}
.frow>*{min-width:0}
/* поля даты и времени на узком экране (360px) сжимаются, а не раздвигают шторку шире экрана */
.inp[type=date],.inp[type=time]{min-width:0;max-width:100%;-webkit-appearance:none;appearance:none;display:block}
/* чипы в листах: по ширине текста, длинные названия — с многоточием, не обрезаются с двух сторон */
.sheet .chips .pill{flex:0 1 auto;min-width:0;max-width:100%;display:block;overflow:hidden;text-overflow:ellipsis;text-align:center}

/* товары */
.qty{display:inline-flex;align-items:center;gap:6px;flex-shrink:0}
.qty button{width:32px;height:32px;border-radius:50%;border:0;background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line);color:var(--fg);font-size:18px;font-weight:600;line-height:1}
.qty b{min-width:18px;text-align:center}
.pthumb{width:44px;height:44px;border-radius:12px;object-fit:cover;flex-shrink:0;background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line);display:flex;align-items:center;justify-content:center;font-size:20px}
#pdPhoto img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
#pdPhoto{flex-shrink:0;border-radius:18px;background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line);font-size:13px;font-weight:600;color:var(--t2);overflow:hidden;padding:0}

/* карусель акций и бегущая строка */
.pcar{position:relative;margin:0 -2px}
.ptrack{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;border-radius:28px}
.ptrack::-webkit-scrollbar{display:none}
.pslide{position:relative;flex:0 0 100%;scroll-snap-align:center;height:236px;border:0;border-radius:28px;overflow:hidden;padding:18px 20px;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:2px;text-align:left;color:#fff;font:inherit;
  background:radial-gradient(120% 140% at 85% 0%,var(--gl1),transparent 60%),linear-gradient(160deg,#2a2a2a,#0c0c0c);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 0 0 1px rgba(255,255,255,.08)}
.pslide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 6s ease-out}
.pslide.cur img{transform:scale(1)}
.pslide .psh{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05) 20%,rgba(0,0,0,.72) 100%)}
.pslide>.pin{position:relative}
.pslide .ptag{position:absolute;top:16px;left:16px;display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  background:rgba(255,255,255,.14);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.pslide .ptag i{width:6px;height:6px;border-radius:50%;background:#f4ead7;box-shadow:0 0 10px #f4ead7}
.pslide.hot .ptag i{background:#ffb15c;box-shadow:0 0 10px #ffb15c}
.pslide .pbig{font-size:48px;line-height:.95;font-weight:800;letter-spacing:-.04em;color:#f4ead7;text-shadow:0 6px 30px rgba(0,0,0,.45)}
.pslide.hot .pbig{color:#ffcf96}
.pslide b{font-size:19px;letter-spacing:-.01em;margin-top:6px}
.pslide .psub{font-size:13.5px;opacity:.78}
.pslide .pin{display:flex;flex-direction:column;align-items:flex-start;gap:2px;transform:translateY(8px);opacity:0;transition:transform .7s cubic-bezier(.2,.8,.2,1),opacity .6s}
.pslide.cur .pin{transform:none;opacity:1}
.pdots{position:absolute;right:20px;bottom:18px;display:flex;gap:5px;pointer-events:none}
.pdots i{width:6px;height:6px;border-radius:3px;background:rgba(255,255,255,.4);transition:width .45s cubic-bezier(.34,1.45,.55,1),background .3s}
.pdots i.on{width:22px;background:#f4ead7}
.ticker{overflow:hidden;border-radius:999px;padding:11px 0;background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh);-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.tk-in{display:flex;width:max-content;animation:tk 22s linear infinite}
.tk-in span{flex-shrink:0;padding-right:36px;font-size:12.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}
.tk-in span::after{content:"•";margin-left:36px;opacity:.5}
@keyframes tk{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){.tk-in{animation:none}.pslide img{transition:none;transform:none}.pslide .pin{transition:none;transform:none;opacity:1}}
.pslide-mini{width:96px;height:60px;flex-shrink:0;border-radius:14px;border:0;overflow:hidden;background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line);color:var(--t2);font:inherit;font-size:12.5px;font-weight:600;padding:0}
.pslide-mini img{width:100%;height:100%;object-fit:cover}

/* ---------- компьютер: широкая раскладка для журнала и кабинета (≥1024px) ---------- */
@media (min-width:1024px){
  .app{max-width:none}
  .app.wide{max-width:none}
  .screen .scroll>.stack,.screen .scroll>.pad.stack{max-width:1120px;margin:0 auto;width:100%;box-sizing:border-box;padding-left:32px;padding-right:32px}
  .navbar .navrow{max-width:1120px;margin:0 auto;padding-left:32px;padding-right:32px;box-sizing:border-box}
  #home .scroll>.stack,#confirm .scroll>.stack,#bookings .scroll>.stack{max-width:620px}
  .bbar{max-width:620px;left:50%;right:auto;margin-left:-310px;width:100%}
  /* журнал: слева управление днём и сводка, справа лента записей */
  #jScroll .chips.scroll-x{flex-wrap:wrap;overflow:visible;margin-left:0;padding-left:0}
  #jScroll .chips .pill{flex:0 0 auto;max-width:none;overflow:visible}
  /* кабинет и списки — плиткой */
  #cabMenu{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;background:none;box-shadow:none;padding:0}
  #cabMenu>*{border-radius:22px;background:linear-gradient(155deg,var(--gl1),var(--gl2));box-shadow:inset 0 1px 0 var(--ghi),inset 0 0 0 1px var(--line),var(--gsh);min-height:84px}
  #stats .scroll>.stack>.g,#services .scroll>.stack>.g,#staffList .scroll>.stack>.g,#clients .scroll>.stack>.g{max-width:none}
  #stats .tiles,#stats .jstats{grid-template-columns:repeat(4,minmax(0,1fr))}
  /* листы — правой панелью во всю высоту */
  .sheet{left:auto;right:0;top:0;bottom:0;width:520px;max-height:none;border-radius:0;padding:28px 32px 28px;overflow-y:auto;justify-content:flex-start;transform:translateX(calc(100% + 40px));box-shadow:-20px 0 60px rgba(0,0,0,.45),inset 1px 0 0 var(--line)}
  .sheet.open{transform:none}
  .sheet>.grab,.sheet .grab{display:none}
  /* статистика: плитки в 4 колонки, карточки в две колонки */
  #stats #statBody{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 24px;align-items:start}
  #stats .jstats{grid-template-columns:repeat(4,minmax(0,1fr))}
  #stats #statBody>div{min-width:0}
  #stats #statBody .g.list{width:100%;box-sizing:border-box}
  #stats .scroll>.stack>#statSeg,#stats .scroll>.stack>.jstats{grid-column:1/-1}
  #stats .scroll>.stack>.seg{max-width:520px}
  /* списки услуг, сотрудников, клиентов, товаров — в две колонки */
  #svcList,#stList,#clList,#pdList{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;background:none;box-shadow:none;overflow:visible;padding:0}
  #svcList>*,#stList>*,#clList>*,#pdList>*{border-radius:20px;background:linear-gradient(155deg,var(--gl1),var(--gl2));box-shadow:inset 0 1px 0 var(--ghi),inset 0 0 0 1px var(--line);min-width:0}
  /* кнопка внизу — по ширине колонки 1120px, а на экранах 1024–1119px — во всю ширину (раньше уезжала влево) */
  .foot{left:max(0px,calc(50% - 560px));right:max(0px,calc(50% - 560px))}
  /* график: календарь крупнее, инструменты справа */
  #sScroll>.stack{display:grid;grid-template-columns:minmax(0,1fr) 380px;column-gap:32px;row-gap:14px;align-items:start}
  #sScroll>.stack>*{grid-column:1;min-width:0}
  #sScroll>.stack>#sStats,#sScroll>.stack>#sTools,#sScroll>.stack>#tpl{grid-column:2}
  /* правая колонка — сверху вниз рядом с календарём: итоги, кнопки, подсказка (раньше кнопки и подсказка уезжали
     под календарь, к самой кнопке «Изменить», и закрывались ею) */
  #sScroll>.stack{grid-template-rows:repeat(6,auto) 1fr}   /* лишняя высота календаря — в последнюю строку, а не между кнопками */
  #sScroll>.stack>.cal{grid-row:3 / span 5}
  #sScroll>.stack>#sStats{grid-row:3}
  #sScroll>.stack>#sTools{grid-row:4}
  #sScroll>.stack>#sRo{grid-column:2;grid-row:5}
  #sScroll>.stack>#sHint{grid-column:2;grid-row:6}
  /* «Изменить: N дней» — по ширине правой колонки, под её кнопками, а не во весь экран поверх календаря */
  #sFoot .foot-in{display:flex;justify-content:flex-end}
  #sFoot .ctaw{width:380px}
  #sScroll .cal .dc{aspect-ratio:1.15;border-radius:16px;font-size:15px}
  #sScroll .chips.scroll-x{flex-wrap:wrap;overflow:visible;margin-left:0;padding-left:0}
  #sScroll .chips .pill{flex:0 0 auto;max-width:none;overflow:visible}
  .menu{right:max(32px,calc((100% - 1120px)/2 + 32px))}
  .island{left:50%}
  .app.modal .screen.active{transform:none;border-radius:0;filter:brightness(.55)}
}

/* ---------- подключение бизнеса: услуги и команда ---------- */
.addbig{align-self:stretch;display:flex;align-items:center;justify-content:center;gap:8px;min-height:56px;border-radius:20px;font-size:15.5px;font-weight:650;color:var(--fg);background:var(--gl3);box-shadow:inset 0 0 0 1.5px var(--line);border:0;cursor:pointer}
.addbig:active{transform:scale(.985)}
.moneyin{display:flex;align-items:center;gap:8px;padding:0 16px}
.moneyin input{flex:1;min-width:0;border:0;outline:0;background:none;color:var(--fg);font:inherit;font-size:17px;font-weight:600;padding:15px 0}
.rrow{display:flex;align-items:center;gap:12px;width:100%;min-height:64px;padding:10px 14px;text-align:left;background:none;border:0;color:inherit;font:inherit;cursor:pointer;box-sizing:border-box}
.rrow+.rrow{border-top:1px solid var(--sep)}
.rrow .th{width:48px;height:48px;border-radius:14px;flex-shrink:0;object-fit:cover;background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line);display:flex;align-items:center;justify-content:center;color:var(--t2);font-weight:650;font-size:17px}
.rrow .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.rrow .tx b{font-weight:600;font-size:15.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rrow .tx span{font-size:13px;color:var(--t3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rrow .chev{color:var(--t3);flex-shrink:0}
.opt{display:flex;align-items:center;gap:12px;width:100%;padding:14px 16px;text-align:left;background:none;border:0;color:inherit;font:inherit;cursor:pointer;box-sizing:border-box}
.opt+.opt{border-top:1px solid var(--sep)}
.opt .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.opt .tx b{font-weight:600;font-size:15.5px}
.opt .tx span{font-size:13px;color:var(--t3);line-height:1.35}
.opt .rd{width:22px;height:22px;border-radius:50%;flex-shrink:0;box-shadow:inset 0 0 0 2px var(--line)}
.opt.on .rd{box-shadow:inset 0 0 0 7px var(--fg)}
.badge{font-size:11px;font-weight:650;letter-spacing:.02em;padding:3px 8px;border-radius:999px;background:var(--gl3);color:var(--t2);flex-shrink:0}

/* ================= Payt UI 1.0: запись по шагам, обложка, карта (17.10.2026) ================= */
.sheet .chips .pill{line-height:24px}
input.inp{min-height:52px;border-radius:16px;padding-left:16px;padding-right:16px}
.link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 12px;font-size:14px;font-weight:600;color:var(--t2);border-radius:999px}
.link.danger{color:var(--bad)}
.ell{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}

/* обложка салона — первое фото работ; навигация поверх фото светлая */
.cover{display:block;position:relative;flex-shrink:0;height:228px;margin:calc(-64px - max(env(safe-area-inset-top,0px),var(--tgtop,0px))) calc(-1 * max(16px,env(safe-area-inset-left,0px))) 0;padding:0;border-radius:0;overflow:hidden;background:none;cursor:zoom-in}
.cover img{width:100%;height:100%;object-fit:cover;display:block;-webkit-mask-image:linear-gradient(180deg,#000 50%,transparent 100%);mask-image:linear-gradient(180deg,#000 50%,transparent 100%)}
.cover::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--photo) 0%,transparent 42%);pointer-events:none}
.cover:not(.hidden)+.hero{margin-top:-62px;position:relative;z-index:1}
.navbar .pill,.navbar .navlogo{transition:color .3s,background .3s,box-shadow .3s}
.navbar.onphoto .navlogo{color:#fff}
.navbar.onphoto .pill{color:#fff;background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.06));box-shadow:inset 0 1px 0 rgba(255,255,255,.32),inset 0 0 0 1px rgba(255,255,255,.14)}
.hero h1.lt{margin:0;font-size:22px}
.hero{display:flex;flex-direction:column;gap:8px}
.hero .meta{margin-top:0}
.addr{display:flex;align-items:center;gap:6px;width:100%;min-height:36px;margin:-4px 0;padding:0;font-size:14px;color:var(--t2);text-align:left;border-radius:12px;background:none}
.addr .ell{flex:1}
.addr .chev{flex-shrink:0;color:var(--t3)}

/* услуги: название, длительность и цена; описание — строкой «… ещё» */
#svcCats .pill{min-height:36px;padding:0 14px;font-size:13px}
.svc{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0;border-radius:24px;text-align:left}
.svc-main{width:100%;display:grid;grid-template-columns:52px minmax(0,1fr) 26px;gap:14px;align-items:center;padding:14px 16px;text-align:left;color:var(--fg);border-radius:inherit;background:none}
.svc .sx{display:flex;flex-direction:column;gap:4px;min-width:0}
.svc .nm{display:block;font-weight:600;font-size:15.5px;line-height:1.3;overflow-wrap:break-word}
.svc .mt{display:block;font-size:13px;line-height:1.35;color:var(--t2);font-variant-numeric:tabular-nums}
.svc .mt b{color:var(--fg);font-weight:600;white-space:nowrap}
.svc .mt .old{text-decoration:line-through;color:var(--t3);margin-left:6px;white-space:nowrap}
.svc .mt .dc{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:999px;background:var(--sel-bg);color:var(--sel-fg);font-size:11px;font-weight:700;vertical-align:1px}
/* карточка услуги: название и плашки «цена · длительность · Инфо»; описание — в листе «Инфо» */
.svc-main{cursor:pointer;-webkit-tap-highlight-color:transparent;box-sizing:border-box}   /* div, а не button: ширина с отступами — как у кнопки */
.svc-main:focus-visible{outline:2px solid var(--fg);outline-offset:-2px}
.stags{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.svc .stags{margin-top:2px}
.stag{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border-radius:999px;font-size:12.5px;font-weight:600;line-height:1;white-space:nowrap;color:var(--t2);background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line);font-variant-numeric:tabular-nums}
.stag.spr{background:var(--sel-bg);color:var(--sel-fg);box-shadow:none;font-weight:700}
.stag.spr s{font-weight:500;opacity:.55;margin-left:3px}
.stag.spd{background:none;color:var(--fg);box-shadow:inset 0 0 0 1px var(--rim3)}
.stag.inf{position:relative;color:var(--fg);background:none;box-shadow:inset 0 0 0 1px var(--rim3);cursor:pointer;transition:transform .2s}
.stag.inf::before{content:"";position:absolute;inset:-10px -6px}   /* по маленькой плашке легко попасть пальцем */
.stag.inf:active{transform:scale(.94)}
.stag.inf svg{flex-shrink:0;opacity:.9}
/* лист «Инфо»: большое фото с названием поверх, крестик на фото */
.si-cover{position:relative;align-self:stretch;margin:-2px -8px 0;border-radius:28px;overflow:hidden;aspect-ratio:16/11;background:var(--gl2)}
.si-cover img{width:100%;height:100%;object-fit:cover;display:block;cursor:zoom-in}
.si-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.72));pointer-events:none}
.si-cover b{position:absolute;left:18px;right:18px;bottom:14px;z-index:1;color:#fff;font-size:21px;font-weight:700;letter-spacing:-.01em;line-height:1.2;text-shadow:0 2px 12px rgba(0,0,0,.5);pointer-events:none}
.si-cover #siClose{position:absolute;top:12px;right:12px;z-index:2;color:#fff;background:rgba(0,0,0,.38);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.si-tags{align-self:stretch}
.si-tags .stag{height:28px;padding:0 11px;font-size:13.5px}
#siPick .cki{display:inline-flex;width:20px;height:20px;align-items:center;justify-content:center}
#siPick .cki svg{width:16px;height:16px}
.sinfo-ph{align-self:stretch;margin:0 -18px;padding:0 18px}
.sinfo-ph img{height:180px;width:240px;border-radius:20px;cursor:zoom-in}
.sinfo-meta{align-self:stretch;font-size:14px;padding:0 2px;font-variant-numeric:tabular-nums}
.sinfo-meta b{color:var(--fg);font-weight:600}
.sinfo-meta .old{text-decoration:line-through;color:var(--t3);margin-left:6px}
.sinfo-meta .dc{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:999px;background:var(--sel-bg);color:var(--sel-fg);font-size:11px;font-weight:700}
.sinfo-desc{align-self:stretch;font-size:15px;line-height:1.5;white-space:pre-wrap;padding:0 2px;color:var(--fg)}

/* шаг «дата и время» */
.tsum{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:22px}
.tsum .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.tsum .tx b{font-size:15px;font-weight:600}
.tsum .tx span{font-size:13px}
.tsum .pr{font-weight:600;font-size:15px;white-space:nowrap;font-variant-numeric:tabular-nums}
.tmaster{display:flex;align-items:center;gap:12px;padding:0 2px 0 4px}
.tmaster .av{width:40px;height:40px;font-size:12px;overflow:hidden;background:linear-gradient(160deg,var(--gl1),var(--gl2));box-shadow:inset 0 1px 0 var(--ghi),inset 0 0 0 1px var(--line)}
.tmaster .av.on{background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh)}
.tmaster .av img,.opt .av img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.tmaster .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.tmaster .tx b{font-size:15px;font-weight:600}
.tmaster .tx span{font-size:12.5px}
.opt .av{overflow:hidden;font-size:12px;background:linear-gradient(160deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line)}
.opt .av.on{background:var(--sel-bg);color:var(--sel-fg)}
.waitcard{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:18px}
.waitcard .wic{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--well);box-shadow:var(--wsh);color:var(--t2)}
.waitcard .h1{font-size:17px}
.waitcard .pill{align-self:stretch}
#waitBtn.joined:disabled{opacity:1;color:var(--ok);gap:8px}   /* уже в листе ожидания — спокойная отметка, а не кнопка */

/* карта */
.mapbox{align-self:stretch;flex-shrink:0;height:220px;border-radius:24px;overflow:hidden;position:relative;z-index:0;background:var(--well);box-shadow:var(--wsh);font-family:var(--f-text)}
.mapbox.tall{height:300px}
.mapbox.leaflet-container{background:#dcd7cf}
.app:not(.light) .mapbox.leaflet-container{background:#191919}
.app:not(.light) .mapbox .leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.95) contrast(.86) saturate(.45)}
.mapbox .leaflet-control-attribution{font-size:10px;line-height:1.4;padding:1px 6px;border-radius:8px 0 0 0;background:rgba(255,255,255,.75);color:#333}
.app:not(.light) .mapbox .leaflet-control-attribution{background:rgba(0,0,0,.6);color:#bbb}
.app:not(.light) .mapbox .leaflet-control-attribution a{color:#ddd}
.mapbox .leaflet-control-zoom a{width:36px;height:36px;line-height:36px;font-size:18px}
.mpin{position:relative;display:block;width:36px;height:46px}
.mpin::before{content:"";position:absolute;left:4px;top:2px;width:28px;height:28px;box-sizing:border-box;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:#0b0b0b;border:3px solid #fff;box-shadow:0 8px 18px rgba(0,0,0,.45)}
.mpin i{position:absolute;left:14px;top:12px;width:8px;height:8px;border-radius:50%;background:#fff}
.mpin::after{content:"";position:absolute;left:12px;bottom:0;width:12px;height:5px;border-radius:50%;background:rgba(0,0,0,.35);filter:blur(1px)}
.mp-addr{align-self:stretch;display:flex;flex-direction:column;gap:2px;padding:0 4px}
.mp-addr b{font-size:16px;font-weight:600}
.mp-addr span{font-size:14px;line-height:1.4}
.mp-go{align-self:stretch;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.mp-go .pill{padding:0 8px;font-size:13.5px;min-width:0}
.mk-search{align-self:stretch;display:flex;gap:8px;margin:0}
.mk-search .inp{flex:1;min-width:0}
.mk-search .pill{min-height:52px;padding:0 18px}
.mk-found{align-self:stretch;display:flex;align-items:center;gap:10px;padding:0 4px}
.mk-found span{flex:1;min-width:0;font-size:13px;line-height:1.35}
#mkResults .opt .tx b{white-space:normal;font-size:14.5px;line-height:1.35}

@media (min-width:1024px){
  #time .scroll>.stack{max-width:620px}
  #time .bbar{max-width:620px;left:50%;right:auto;margin-left:-310px;width:100%}
  .cover{margin:8px 0 0;border-radius:28px}
  .cover img{-webkit-mask-image:linear-gradient(180deg,#000 60%,transparent 100%);mask-image:linear-gradient(180deg,#000 60%,transparent 100%)}
  .cover:not(.hidden)+.hero{margin-top:-48px;padding-left:16px}
  .mapbox.tall{height:380px}
}
/* кабинет: услуги и точка на карте */
.rrow .nmrow{display:flex;align-items:center;gap:8px;min-width:0}
.rrow .nmrow b{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rrow.off .th,.rrow.off .tx{opacity:.55}
.rrow .th svg{display:block}
.mappt{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;text-align:left;color:var(--fg)}
.mappt .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mappt .tx b{font-size:15px;font-weight:600}
.mappt .tx span{font-size:13px;color:var(--t2);line-height:1.35}
.mappt .chev{color:var(--t3);flex-shrink:0}
.mpic{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--well);box-shadow:var(--wsh);color:var(--t2)}
#mkResults .opt{align-items:flex-start}
#mkResults .mpic{width:32px;height:32px}
#cMav{overflow:hidden}#cMav img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.sum2{font-size:19px;font-weight:650}
@media (max-width:380px){.bbar .cta{padding:15px 16px 15px 20px;font-size:16px}.sum2{font-size:17.5px}.bbar-in{gap:10px}.st4 button{font-size:11px;letter-spacing:-.02em}#statK2 b{font-size:14px!important}}
.mp-hint{align-self:stretch;font-size:12.5px;color:var(--t2);padding:0 4px;margin-bottom:-6px}
.mapbox .leaflet-bar{border:0;border-radius:14px;overflow:hidden;box-shadow:0 6px 18px rgba(0,0,0,.3)}
.mapbox .leaflet-bar a{background:var(--bg1);color:var(--fg);border-bottom:1px solid var(--sep)}
.mapbox .leaflet-bar a:last-child{border-bottom:0}
/* кабинет по Payt UI 1.0 */
.cabme{display:flex;align-items:center;gap:14px;padding:16px;border-radius:28px}
.cabme .av{overflow:hidden;font-size:15px;background:linear-gradient(160deg,var(--gl1),var(--gl2));box-shadow:inset 0 1px 0 var(--ghi),inset 0 0 0 1px var(--line)}
.cabme .av img{width:100%;height:100%;object-fit:cover;display:block}
.cabme .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.cabme .tx b{font-size:15.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cabme .tx span{font-size:12.5px;color:var(--t3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crow{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:10px 14px 10px 12px;text-align:left;color:var(--fg);font-size:15px;background:none}
.crow+.crow{box-shadow:inset 0 1px 0 var(--sep)}
.crow .cic{width:36px;height:36px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:linear-gradient(160deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line)}
.crow .nm{flex:1;min-width:0;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crow .v{font-size:13px;color:var(--t2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:48%}
.crow .chev{color:var(--t3);flex-shrink:0}
@media (min-width:1024px){
  #cabMenu .crow{flex-direction:row;min-height:84px}
  #cabMe{max-width:none}
}
@media (min-width:1024px){#cabMenu::before,#svcList::before,#stList::before,#clList::before,#pdList::before{display:none}}
#mapSheet{z-index:46}

/* ================= Аудит 17.10.2026: исправления вёрстки ================= */
/* полосы сверху и снизу — плотнее: текст под ними не просвечивает (особенно днём) */
.scene{--mat-strong:rgba(10,10,10,.86)}
.scene.light{--mat-strong:rgba(250,248,245,.93)}
.scene.t-pearl{--mat-strong:rgba(22,14,16,.86)}
.scene.t-pearl.light{--mat-strong:rgba(255,249,247,.93)}
.scene.t-clinic{--mat-strong:rgba(8,20,24,.86)}
.scene.t-clinic.light{--mat-strong:rgba(250,253,253,.94)}
.navbar::before,.bbar::before{background:var(--mat-strong,var(--mat))}
.screen{overflow:clip}
/* длинное название бизнеса в шапке не наезжает на логотип и кнопки */
.navtitle{max-width:min(46%,240px);overflow:hidden;text-overflow:ellipsis}
/* скидка в карточке услуги — маленькая метка (класс .dc занят днём календаря графика) */
.pdc{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:999px;background:var(--sel-bg);color:var(--sel-fg);font-size:11px;font-weight:700;line-height:1.35;vertical-align:1px;white-space:nowrap}
/* окно со скидкой: время и «−20%» друг под другом, не выходят за края */
.slot.has-d{flex-direction:column;gap:2px;padding:7px 0;line-height:1}
.slot.has-d .sl-d{margin-top:0}
/* «Приду / В пути / Опаздываю / Не приду»: длинные подписи (узбекский) переносятся, а не наезжают */
.st4 button{white-space:normal;line-height:1.15;font-size:12px;padding:8px 2px;min-height:40px;overflow-wrap:normal;word-break:normal;letter-spacing:-.01em}   /* слово не рвётся посередине («Опаздыва/ю»): кнопка шире, соседние уже */
/* длинное имя мастера — с многоточием, а не обрезано с обеих сторон */
.mst .nm,.mst .rl{max-width:100%;padding:0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box}
.mst.dim{opacity:.45}
.opt:disabled{opacity:.45;cursor:default}
/* сообщение сверху: длинный текст в две-три строки, ошибка — со своим значком */
.island.show{max-width:min(360px,calc(100% - 24px))}
.island.long{height:auto;min-height:38px;padding:8px 16px 8px 9px;border-radius:20px;white-space:normal;line-height:1.3}
.island.long .isl-tx{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.island.bad .isl-ic{background:var(--bad);color:#000}
.island.bad .isl-ic svg{display:none}
.island.bad .isl-ic::after{content:"!";font-weight:800;font-size:13px;line-height:1}
/* дни: стрелки «неделя назад / вперёд» */
.wknav{display:flex;align-items:center;gap:6px}
.wknav .pill.icon{width:36px;height:36px;padding:0;min-height:0}
.wknav .pill.icon:disabled{opacity:.35}
.days button.nod{visibility:hidden}
.empty-slots{display:flex;flex-direction:column;align-items:center;gap:12px}
.empty-svcs{padding:22px 18px;text-align:center;color:var(--t2);font-size:14.5px;line-height:1.45}
/* «Вы записаны»: крестик — закрыть и в браузере, где нет кнопки «назад» Telegram */

.okx{position:absolute;top:12px;right:12px;width:36px;height:36px;min-height:0;padding:0;z-index:2}
/* режим оформления: тёмный / светлый / как в Telegram */
.mseg{display:inline-flex;gap:4px;padding:3px;border-radius:999px;background:var(--well);box-shadow:var(--wsh);flex-shrink:0}
.mseg button{min-height:32px;padding:0 10px;border-radius:999px;font-size:12.5px;font-weight:600;color:var(--t2);background:none}
.mseg button.on{background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh)}

/* аудит: журнал — инструменты переносятся на узком экране, цена в «Записать», подтверждение вторым нажатием */
.jtools{flex-wrap:wrap;overflow:visible}
.wprice{margin-top:8px;font-size:13px}
.armed{box-shadow:inset 0 0 0 1.5px var(--bad,#e5484d)!important;color:var(--bad,#e5484d)!important}
.jtools .pill{flex:0 0 auto}
/* длинная подсказка: ширина по экрану (у left:50% «по содержимому» — только пол-экрана, текст обрезался) */
.island.long.show{width:min(360px,calc(100% - 24px))}
/* инструменты журнала — в две строки на 360 px, а не в три */
.jtools{gap:6px}
.jtools .pill{padding:7px 12px;font-size:13px}
/* длинное имя в заголовке листа не сжимает «Готово» */
.sh-title > .pill, .sh-title > button{flex-shrink:0}
.sh-title > b{min-width:0;overflow-wrap:anywhere}
/* график на 1024+: открыта панель дня — календарь сдвигается влево целиком (панель не закрывает воскресенье) */
@media (min-width:1024px){
  #app.modal #schedule.active #sScroll>.stack{grid-template-columns:minmax(0,1fr);grid-template-rows:none;max-width:none;margin:0;padding-right:552px}
  #app.modal #schedule.active #sScroll>.stack>*{grid-column:1;grid-row:auto}
}
/* кнопки действий в листах: длинная подпись («Разослать клиентам») переносится, а не обрезается по краям */
.vbtns .row2 .pill{flex:1 1 0;min-width:0;white-space:normal;line-height:1.2;text-align:center;padding-left:12px;padding-right:12px}

/* 18.10: режим — отдельной строкой во всю ширину меню, чтобы «Авто» не обрезалось на телефоне */
.mi.mrow{flex-direction:column;align-items:stretch;gap:8px}
.mi.mrow .mseg{display:flex;width:100%;box-sizing:border-box}
.mi.mrow .mseg button{flex:1;min-width:0;padding:0 6px;white-space:nowrap}

/* 18.10: журнал-сетка (как в Altegio): колонки по мастерам, цветные записи по статусам, неделя мастера */
:root,.scene{--gb:#8fb4ee;--onc:#0b0b0b}
.scene.light{--gb:#2f62b8;--onc:#fff}
#jView{margin:0}
#jList.gmode .jnode,#jList.gmode .empty-slots{display:none}
.gsc{overflow:auto;max-height:min(76vh,780px);border-radius:22px;position:relative;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;scrollbar-width:thin;background:linear-gradient(155deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line);outline:none}
.gin{min-width:calc(48px + var(--n)*var(--cw))}
.grow{display:grid;grid-template-columns:48px repeat(var(--n),minmax(var(--cw),1fr))}
.ghead{position:sticky;top:0;z-index:4;background:var(--mat-strong,rgba(14,14,14,.94));border-bottom:1px solid var(--sep)}
/* колонка времени — непрозрачная: при прокрутке вбок записи не просвечивают сквозь неё */
.gtc{position:sticky;left:0;z-index:3;background:linear-gradient(var(--mat-strong,rgba(14,14,14,.94)),var(--mat-strong,rgba(14,14,14,.94))),var(--bg1)}
.ghead .gtc{z-index:5}
.gtm{position:absolute;right:8px;font-size:11.5px;color:var(--t3);font-variant-numeric:tabular-nums}
.gh{display:flex;align-items:center;gap:9px;padding:10px;min-width:0;border-left:1px solid var(--sep)}
.gh .gn{display:flex;flex-direction:column;min-width:0}
.gh .gn b{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gh .gn span{font-size:11.5px}
.gav{width:34px;height:34px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;color:#0b0b0b;background:var(--av,#efe8de)}
.gh.wk{flex-direction:column;gap:2px;justify-content:center;padding:8px 4px;text-align:center}
.gh.wk .t3{font-size:11.5px}
.gh.wk .gd{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px}
.gh.wk.today .gd{background:var(--sel-bg);color:var(--sel-fg)}
.gcol{position:relative;border-left:1px solid var(--sep);cursor:pointer;background-image:linear-gradient(var(--sep) 1px,transparent 1px),linear-gradient(rgba(128,128,128,.08) 1px,transparent 1px);background-size:100% calc(var(--gr)*2),100% var(--gr)}
.gcol.today{background-color:rgba(128,128,128,.07)}
.goff{position:absolute;left:0;right:0;pointer-events:none;background:repeating-linear-gradient(135deg,rgba(128,128,128,.14) 0 6px,transparent 6px 12px)}
.goff span{position:absolute;left:8px;top:5px;font-size:11px;color:var(--t3)}
.gc{position:absolute;left:4px;right:4px;box-sizing:border-box;border-radius:10px;overflow:hidden;text-align:left;padding:0;color:var(--fg);display:flex;flex-direction:column;cursor:pointer;background:var(--gl1);box-shadow:inset 0 0 0 1px var(--c);background:color-mix(in srgb,var(--c) 17%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 55%,transparent)}
.gc .gb{height:19px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:0 9px;font-size:11px;font-weight:700;background:var(--c);color:var(--onc);white-space:nowrap;overflow:hidden}
.gc .gx{padding:5px 9px;display:flex;flex-direction:column;gap:2px;min-width:0}
.gc .gs{font-size:12.5px;font-weight:700;line-height:1.25;overflow:hidden;text-overflow:ellipsis}
.gc .gcl{font-size:12px;color:var(--t2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gc.cp{flex-direction:row;align-items:center;gap:6px;padding:0 8px;font-size:12px;white-space:nowrap}
.gc.cp b{font-variant-numeric:tabular-nums}
.gc .gtx{overflow:hidden;text-overflow:ellipsis;min-width:0}
.gdot{width:7px;height:7px;border-radius:50%;background:var(--c);flex-shrink:0}
.s-wait{--c:var(--late)}.s-conf{--c:var(--gb)}.s-come{--c:var(--ok)}.s-miss{--c:var(--bad)}.s-done{--c:var(--idle)}
.gnow{position:absolute;left:0;right:0;height:2px;background:var(--bad);pointer-events:none;z-index:2}
.gnow::before{content:"";position:absolute;left:-4px;top:-4px;width:9px;height:9px;border-radius:50%;background:var(--bad)}
.glg{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:12px;font-size:12px;color:var(--t2)}
.glg i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;background:var(--c)}
.gnote{font-size:12px;margin-top:6px}
}

/* 18.10 (2): журнал — компактно, как на утверждённом макете: тонкая панель сверху, слева мини-календарь и кнопки */
.jwrap{display:flex;flex-direction:column;gap:10px;padding-top:4px}
.jside,.jmain{display:contents}
.jtop{order:1;display:flex;flex-direction:column;gap:8px}
#jTools{order:2}
#jGrid{order:3}#jList{order:4}#jNote{order:5}
.jmini{display:none}
.jlab{font-family:var(--f-head);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--t3);font-weight:500;padding-left:2px}
.jrow{display:flex;align-items:center;gap:8px;min-width:0}
.jdate{margin:0 0 0 4px;flex:1;min-width:0;font-family:var(--f-text);font-size:17px;font-weight:700;letter-spacing:-.01em;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jb{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:0 0 auto;height:32px;padding:0 13px;border-radius:16px;font-size:12.5px;font-weight:600;color:var(--fg);white-space:nowrap;background:linear-gradient(180deg,var(--gl1),var(--gl2));box-shadow:inset 0 1px 0 var(--ghi),inset 0 0 0 1px var(--line)}
.jb.ic{width:32px;padding:0}
.jb.sm{height:26px;width:26px}
.jb.on{background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh)}
.jb.pri{background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh);font-weight:650}
.jb.hot{color:var(--late);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--late) 45%,transparent);background:color-mix(in srgb,var(--late) 10%,transparent)}
#jTools{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px}
#jTools::-webkit-scrollbar{display:none}
#jAdd{order:0}#jHot{order:1}#jSell{order:2}#jSched{order:3}#jCab{order:4}
.jflt{flex-wrap:wrap;row-gap:8px}
.jseg{flex:0 0 auto;padding:3px}
.jseg .seg-i{top:3px;bottom:3px;left:3px}
.jseg button{padding:0 12px;height:26px;font-size:12.5px}
#jStaff.chips{flex:1 1 auto;min-width:0;margin:0;padding:0;gap:6px}
#jStaff .pill.sm{padding:0 12px;height:32px;font-size:12.5px;font-weight:600;min-height:0}
.jsum{display:flex;align-items:center;gap:12px;flex:0 0 auto;font-size:12px;color:var(--t2);white-space:nowrap}
.jsum b{font-size:13px;color:var(--fg);font-variant-numeric:tabular-nums}
.jsum .rev{height:26px;display:inline-flex;align-items:center;padding:0 11px;border-radius:13px;font-weight:650;color:var(--ok);background:color-mix(in srgb,var(--ok) 13%,transparent)}
.jsum .late{color:var(--late)}
/* сетка помельче */
.gh{padding:8px 10px;gap:8px}
.gav{width:28px;height:28px;font-size:12px}
.gh .gn b{font-size:13px}
.gh .gn span{font-size:11px}
.gh.wk .gd{width:26px;height:26px;font-size:14px}
.gh.wk .t3{font-size:11px}
.gtm{font-size:11px}
.gc{border-radius:9px}
.gc .gb{height:17px;font-size:10.5px;padding:0 8px}
.gc .gx{padding:4px 8px}
.gc .gs{font-size:12px}
.gc .gcl{font-size:11.5px}
.gc.cp{font-size:11.5px}
.glg{font-size:11.5px}
.gnote{font-size:11.5px}
@media (min-width:1024px){
  .jwrap{display:grid;grid-template-columns:224px minmax(0,1fr);gap:0 20px;max-width:1480px;align-items:start}
  .jside{display:flex;flex-direction:column;gap:14px;position:sticky;top:0}
  .jmain{display:flex;flex-direction:column;gap:10px;min-width:0}
  .jtop,#jTools,#jGrid,#jList,#jNote{order:0}
  .jmini{display:block;border-radius:18px;padding:10px 8px 8px;background:linear-gradient(155deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line)}
  .jmini .mh{display:flex;align-items:center;justify-content:space-between;padding:0 2px 6px}
  .jmini .mh b{font-size:13px;font-weight:650}
  .jmini .mw,.jmini .md{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));text-align:center}
  .jmini .mw span{font-size:10.5px;color:var(--t3);padding:2px 0 4px}
  .jmini .md i{display:block}
  .jmini .md button{height:28px;margin:1px;border-radius:14px;font-size:12px;color:var(--t2)}
  .jmini .md button.now{box-shadow:inset 0 0 0 1px var(--t3);color:var(--fg)}
  .jmini .md button.sel{background:var(--sel-bg);color:var(--sel-fg);font-weight:700;box-shadow:var(--sel-sh)}
  #jTools{flex-direction:column;overflow:visible;margin:0;padding:0;gap:8px}
  #jAdd,#jHot,#jSell,#jSched,#jCab{order:0}
  #jHot{order:5}
  #jTools .jb{height:36px;border-radius:18px;justify-content:center;font-size:13px}
  #jTools .jb.pri{height:40px;border-radius:20px;font-size:13.5px}
  .jtop{padding-top:2px}
  .gsc{max-height:min(82vh,860px)}
  #jList:not(.gmode){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-content:start}
}

/* заставка ждёт звук (early.js): анимация на паузе, пока звук не пошёл */
html.spw .splash *{animation-play-state:paused!important}

/* 18.10 (3): «Записать клиента» — номер с кодом страны и поиск клиента в базе */
.wcl{gap:8px}
.wph{display:flex;gap:8px;align-items:stretch}
.wcc{flex-shrink:0;display:flex;align-items:center;gap:6px;padding:0 12px 0 14px;border:0;border-radius:14px;background:var(--well);box-shadow:var(--wsh);color:var(--fg);font:inherit;font-size:16px;font-weight:650;font-variant-numeric:tabular-nums;cursor:pointer}
.wcc svg{opacity:.55;transition:transform .2s}
.wcc[aria-expanded="true"] svg{transform:rotate(180deg)}
.wph .inp{flex:1;min-width:0;font-variant-numeric:tabular-nums;letter-spacing:.03em}
.wfhint{font-size:12.5px;line-height:1.35;padding:0 4px}
.wfound{display:flex;flex-direction:column;border-radius:16px;overflow:hidden;background:var(--well);box-shadow:inset 0 0 0 1px var(--line);animation:wfIn .18s ease-out}
@keyframes wfIn{from{opacity:0;transform:translateY(-4px)}}
.wf{display:flex;align-items:center;gap:11px;width:100%;padding:10px 12px;border:0;background:transparent;color:var(--fg);font:inherit;text-align:left;cursor:pointer}
.wf+.wf{border-top:1px solid var(--sep)}
.wf:active{background:var(--glow)}
.wf .av{flex-shrink:0;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;background:var(--glow);color:var(--fg)}
.wf .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.wf .tx b{font-size:15px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wf .tx span{font-size:12.5px;color:var(--t3);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wf mark,.wpicked mark{background:none;color:inherit;font-weight:800;text-decoration:underline;text-decoration-color:color-mix(in srgb,currentColor 45%,transparent);text-underline-offset:3px}
.wf .tx span mark{color:var(--fg)}
.wf .ns{flex-shrink:0;font-size:11px;font-weight:700;padding:3px 8px;border-radius:9px;color:var(--bad);background:color-mix(in srgb,var(--bad) 14%,transparent)}
.wf-new{padding:11px 14px;font-size:13.5px;color:var(--t2)}
.wpicked{display:flex;align-items:center;gap:11px;padding:10px 10px 10px 12px;border-radius:16px;background:color-mix(in srgb,var(--ok) 11%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ok) 38%,transparent);animation:wfIn .18s ease-out}
.wpicked .ok{flex-shrink:0;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--ok);color:#0b0b0b}
.wpicked .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.wpicked .cap{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ok)}
.wpicked .tx b{font-size:15px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wpicked .tx span:not(.cap){font-size:12.5px;color:var(--t3);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wpicked .tx .note{color:var(--late)!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wpicked .pill{flex-shrink:0}
@media (prefers-reduced-motion:reduce){.wfound,.wpicked{animation:none}}

/* 18.10 (4): своё время клиента у мастера */
.vbtns .ctbtn{display:flex;align-items:center;justify-content:center;gap:8px;font-weight:600}
.vbtns .ctbtn svg{opacity:.7;flex-shrink:0}
.ctwho{align-self:stretch;display:flex;flex-direction:column;gap:4px;padding:0 2px}
.ctwho b{font-size:17px;font-weight:700}
.ctwho span{font-size:13px;line-height:1.4}
.ctlist{align-self:stretch}
.ctrow{gap:8px;padding:10px 10px 10px 14px}
.ctrow .nm{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ctrow .nm b{font-size:14.5px;font-weight:600;line-height:1.25;overflow-wrap:break-word;hyphens:auto;-webkit-hyphens:auto}
.ctrow .nm span{font-size:12.5px;color:var(--t3)}
.ctstep{flex-shrink:0;display:flex;align-items:center;gap:4px}
.ctstep .pill{width:34px;height:34px;min-width:34px;padding:0;justify-content:center}
.ctstep .cv{min-width:60px;text-align:center;font-size:14.5px;font-weight:650;font-variant-numeric:tabular-nums;padding:6px 4px;border-radius:10px;transition:background .2s,color .2s}
.ctrow.chg .cv{background:color-mix(in srgb,var(--ok) 16%,transparent);color:var(--ok)}
.ctrow.chg .nm span{text-decoration:line-through;text-decoration-color:color-mix(in srgb,currentColor 55%,transparent)}
.ctsum{align-self:stretch;font-size:14px;padding:2px 4px;font-variant-numeric:tabular-nums}
.ctsum.chg{color:var(--fg);font-weight:600}
#ctmQuick{align-self:stretch}
#ctmSheet>*{flex-shrink:0}

/* 18.10 (5): журнал на телефоне — шапка в одну строку, полоса недели, мастера кружками, кнопка «Записать» (макет 18.10) */
.jhd,.jcd,.jhd-today,.jwk,.jfab,.jfabm,.jfabs{display:none}
#jView .vic,#jStaff .sav{display:none}
.mi.jx,.mrole.jx,.msep.jx{display:none}
.mrole{padding:10px 14px 6px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--t3)}
.msep{height:1px;background:var(--sep);margin:4px 12px}
@media (max-width:1023.98px){
  /* шапка: дата вместо логотипа, язык — в меню */
  #jNav .navlogo,#jNav .navtitle,#jNav #langBtn2{display:none}
  #jNav .navrow{justify-content:flex-start;gap:8px}
  .jhd{display:flex;align-items:center;gap:6px;flex:1 1 auto;min-width:0;height:100%;padding:0;border:0;background:none;color:var(--fg);font:inherit;text-align:left;cursor:pointer}
  .jhd-t{display:flex;flex-direction:column;min-width:0}
  .jhd small{font-size:10.5px;font-weight:650;letter-spacing:.09em;text-transform:uppercase;color:var(--t3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.35}
  .jhd b{font-size:20px;font-weight:750;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
  .jhd b .sh{display:none}
  .jhd-ch{flex-shrink:0;opacity:.5;margin-top:13px;transition:transform .25s}
  .jhd[aria-expanded="true"] .jhd-ch{transform:rotate(180deg)}
  .jhd-today:not(.hidden){display:inline-flex;height:30px;padding:0 12px;font-size:12px}
  .jnr{flex-shrink:0}
  /* свёрнутая шапка при прокрутке */
  #journal.jcol #jNav{--p:1!important}
  #journal.jcol .jhd small,#journal.jcol .jhd-today,#journal.jcol .jhd-ch{display:none}
  #journal.jcol .jhd b{font-size:17px}
  #journal.jcol .jhd b .lg{display:none}
  #journal.jcol .jhd b .sh{display:inline}
  #journal.jcol .jcd{display:flex;gap:4px;animation:jcdIn .25s ease-out}
  @keyframes jcdIn{from{opacity:0;transform:translateY(6px)}}
  .jcd button{width:30px;height:30px;border-radius:15px;border:0;padding:0;font:inherit;font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--t2);background:linear-gradient(180deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line)}
  .jcd button.now{color:var(--fg);box-shadow:inset 0 0 0 1.5px var(--t3)}
  .jcd button.on{background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh)}
  /* полоса недели */
  #jRole,#jNavRow,#jTools{display:none!important}
  .jtop{gap:10px}
  .jwk{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;touch-action:pan-y}
  .jd{height:56px;border:0;padding:0;border-radius:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;color:var(--fg);font:inherit;cursor:pointer;background:linear-gradient(180deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line);transition:transform .15s}
  .jd:active{transform:scale(.94)}
  .jd i{font-style:normal;font-size:10.5px;font-weight:650;letter-spacing:.05em;text-transform:uppercase;color:var(--t3)}
  .jd b{font-size:17px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.15}
  .jd u{display:flex;gap:2px;height:4px;margin-top:2px;text-decoration:none}
  .jd u s{display:block;width:4px;height:4px;border-radius:2px;background:var(--t3);text-decoration:none}
  .jd.we i{color:color-mix(in srgb,var(--bad) 75%,transparent)}
  .jd.past:not(.on) b{color:var(--t2)}   /* выбранный прошедший день — цвета выбранного, а не «белым по белому» */
  .jd.now:not(.on){box-shadow:inset 0 0 0 1.5px var(--t3)}
  .jd.on{background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh)}
  .jd.on i{color:inherit;opacity:.6}
  .jd.on u s{background:currentColor;opacity:.75}
  /* мастера кружками и вид значками */
  .jflt{flex-wrap:wrap;row-gap:10px}
  #jStaff.chips{order:1;flex:1 1 auto;gap:7px;align-items:center}
  .jflt .jfind{order:2;margin-left:auto}
  .jflt .jseg{order:3}
  .jflt .jsum{order:4;flex:1 0 100%}
  .jseg button{width:34px;padding:0;display:flex;align-items:center;justify-content:center}
  #jView .vtx{display:none}
  #jView .vic{display:block}
  #jStaff .pill.sm.sall{height:32px}
  #jStaff .pill.sm.sst{width:34px;height:34px;min-width:34px;padding:0;border-radius:17px;background:none;box-shadow:none;display:flex;align-items:center;justify-content:center}
  #jStaff .snm{display:none}
  #jStaff .sav{display:flex;width:32px;height:32px;border-radius:16px;align-items:center;justify-content:center;font-size:13.5px;font-weight:750;background:var(--av);color:#0b0b0b;transition:box-shadow .2s,opacity .2s}
  #jStaff .sst.on .sav{box-shadow:0 0 0 2px var(--bg1),0 0 0 3.5px var(--fg)}
  #jStaff .sst.soff .sav{opacity:.42}
  .jsum{gap:8px;font-size:12.5px;color:var(--t3)}
  .jsum .rev{margin-left:auto;height:auto;padding:0;background:none;font-size:12.5px}
  /* календарь месяца под шапкой — по нажатию на дату */
  #journal.jcal .jmini{display:block;order:0;border-radius:18px;padding:10px 8px 8px;background:linear-gradient(155deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line);animation:jcdIn .25s ease-out}
  #journal.jcal .jmini .mh{display:flex;align-items:center;justify-content:space-between;padding:0 2px 6px}
  #journal.jcal .jmini .mh b{font-size:14px;font-weight:650}
  #journal.jcal .jmini .mw,#journal.jcal .jmini .md{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));text-align:center}
  #journal.jcal .jmini .mw span{font-size:11px;color:var(--t3);padding:2px 0 4px}
  #journal.jcal .jmini .md i{display:block}
  #journal.jcal .jmini .md button{height:36px;margin:1px;border-radius:18px;font-size:14px;color:var(--t2)}
  #journal.jcal .jmini .md button.now{box-shadow:inset 0 0 0 1px var(--t3);color:var(--fg)}
  #journal.jcal .jmini .md button.sel{background:var(--sel-bg);color:var(--sel-fg);font-weight:700;box-shadow:var(--sel-sh)}
  /* кнопка «Записать» и её меню */
  .jfab{display:flex;position:absolute;z-index:30;right:max(18px,env(safe-area-inset-right,0px));bottom:calc(22px + env(safe-area-inset-bottom,0px));height:54px;min-width:54px;padding:0 22px 0 18px;border:0;border-radius:27px;align-items:center;justify-content:center;gap:8px;font:inherit;font-size:15px;font-weight:750;background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh),0 10px 28px rgba(0,0,0,.45);-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;touch-action:manipulation;cursor:pointer}
  .jfab svg{transition:transform .25s}
  /* подпись и легенда под сеткой не прячутся под кнопкой «Записать»: справа оставляем ей место */
  #journal .glg,#journal .gnote{padding-right:150px}
  #journal.jcol .glg,#journal.jcol .gnote,#journal.jfabon .glg,#journal.jfabon .gnote{padding-right:70px}
  #journal.jcol .jfab,#journal.jfabon .jfab{padding:0}
  #journal.jcol .jfab span,#journal.jfabon .jfab span{display:none}
  #journal.jfabon .jfab svg{transform:rotate(45deg)}
  .jfabs{display:block;position:absolute;inset:0;z-index:29;background:var(--dim);opacity:0;pointer-events:none;transition:opacity .25s;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
  #journal.jfabon .jfabs{opacity:1;pointer-events:auto}
  .jfabm{display:flex;position:absolute;z-index:31;right:max(18px,env(safe-area-inset-right,0px));bottom:calc(88px + env(safe-area-inset-bottom,0px));flex-direction:column;align-items:flex-end;gap:10px;opacity:0;transform:translateY(12px) scale(.96);transform-origin:bottom right;pointer-events:none;transition:opacity .2s,transform .3s cubic-bezier(.34,1.45,.55,1)}
  #journal.jfabon .jfabm{opacity:1;transform:none;pointer-events:auto}
  .jfabm .fi{display:flex;align-items:center;gap:11px;height:48px;padding:0 18px 0 8px;border:0;border-radius:24px;font:inherit;font-size:15px;font-weight:650;color:var(--fg);background:var(--sheet);box-shadow:inset 0 0 0 1px var(--line),0 10px 26px rgba(0,0,0,.4);cursor:pointer}
  .jfabm .fi .ic{width:34px;height:34px;border-radius:17px;display:flex;align-items:center;justify-content:center;background:var(--glow)}
  .jfabm .fi.fmain{background:var(--sel-bg);color:var(--sel-fg)}
  .jfabm .fi.fmain .ic{background:rgba(0,0,0,.08)}
  /* меню ≡ на экране журнала: пункты сотрудника, без клиентских */
  .app.jact .mi.jx:not(.hidden){display:flex}
  .app.jact .mrole.jx:not(.hidden),.app.jact .msep.jx:not(.hidden){display:block}
  .app.jact #miRegister,.app.jact #miMine,.app.jact #miJournal{display:none}
  .menu{max-height:calc(100% - 90px);overflow-y:auto;scrollbar-width:none}
}
@media (prefers-reduced-motion:reduce){.jfabm,.jfab svg,.jd{transition:none}#journal.jcol .jcd,#journal.jcal .jmini{animation:none}}

/* 18.10 (6): карточка визита 2.0 и оплата одним нажатием (макет 18.10) */
.vs2{align-items:stretch;padding-bottom:0!important;gap:13px}
.vs2>*{align-self:stretch}
.vs2 .grab{align-self:center}
.vtop{display:flex;align-items:center;gap:8px}
.vday{flex:1;min-width:0;font-size:14px;font-weight:600;color:var(--t2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vib{width:38px;height:38px;flex-shrink:0;border:0;padding:0;border-radius:19px;display:inline-flex;align-items:center;justify-content:center;color:var(--fg);background:linear-gradient(180deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;text-decoration:none}
.vib.sm{width:34px;height:34px;border-radius:17px}
.vib.red{color:var(--bad)}
.vib.call{color:var(--ok);background:color-mix(in srgb,var(--ok) 13%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ok) 40%,transparent);width:42px;height:42px;border-radius:21px}
.vib.tg{color:#5fb6ea;background:rgba(64,167,227,.15);box-shadow:inset 0 0 0 1px rgba(64,167,227,.42);width:42px;height:42px;border-radius:21px}
.vib.hidden{display:none}
.vcancel{display:flex;flex-direction:column;gap:10px;padding:12px;border-radius:18px;background:color-mix(in srgb,var(--bad) 9%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--bad) 35%,transparent)}
.vcancel .row2{display:flex;gap:10px}.vcancel .pill{flex:1 1 0;min-width:0;padding:12px 10px;justify-content:center;white-space:normal;line-height:1.2;text-align:center}
/* статус */
.vseg{display:flex;gap:2px;padding:4px;border-radius:16px;background:var(--well);box-shadow:var(--wsh)}
.vseg button{flex:1 1 auto;white-space:nowrap;padding:0 6px;height:38px;border:0;border-radius:12px;display:flex;align-items:center;justify-content:center;gap:6px;font:inherit;font-size:12.5px;font-weight:650;color:var(--t2);background:transparent;cursor:pointer;transition:background .2s,color .2s}
.vseg button i{display:none;width:7px;height:7px;border-radius:4px;background:var(--c)}
.vseg button.on{color:var(--fg);background:color-mix(in srgb,var(--c) 22%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 55%,transparent)}
.vseg button.on i{display:block}
.vsdone{flex:1;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:14px;font-weight:700}
.vsdone.ok{color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,transparent)}
.vsdone.bad{color:var(--bad);background:color-mix(in srgb,var(--bad) 12%,transparent)}
.vcs{font-size:13px;font-weight:650;padding:8px 12px;border-radius:12px}
.vcs.ok{color:var(--ok);background:color-mix(in srgb,var(--ok) 10%,transparent)}
.vcs.late{color:var(--late);background:color-mix(in srgb,var(--late) 12%,transparent)}
.vcs.bad{color:var(--bad);background:color-mix(in srgb,var(--bad) 10%,transparent)}
/* клиент */
.vcli{display:flex;align-items:center;gap:12px}
.vav{width:50px;height:50px;flex-shrink:0;border-radius:25px;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:750;background:var(--sel-bg);color:var(--sel-fg)}
.vnm{flex:1;min-width:0;display:flex;flex-direction:column}
.vnm b{font-size:21px;font-weight:750;letter-spacing:-.01em;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vnm span{font-size:14px;color:var(--t2);font-variant-numeric:tabular-nums}
.vact{display:flex;gap:8px;flex-shrink:0}
.vfacts{display:flex;flex-wrap:wrap;gap:6px}
.vfacts span{height:28px;padding:0 11px;border-radius:14px;display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:600;color:var(--t2);background:linear-gradient(180deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line)}
.vfacts span b{color:var(--fg);font-variant-numeric:tabular-nums}
.vfacts span.ok,.vfacts span.ok b{color:var(--ok)}
.vfacts span.bad,.vfacts span.bad b{color:var(--bad)}
.vnote{display:flex;gap:10px;align-items:flex-start;padding:11px 14px;border-radius:16px;background:var(--well);box-shadow:var(--wsh);cursor:text}
.vnote>svg{flex-shrink:0;margin-top:3px;color:var(--late)}
.vnote-in{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.vnote textarea{width:100%;border:0;outline:0;resize:none;padding:0;background:transparent;color:var(--fg);font:inherit;font-size:14.5px;line-height:1.4;min-height:21px}
.vnote textarea::placeholder{color:var(--t3)}
.vnote em{font-style:normal;font-size:11.5px;color:var(--t3)}
.vlab{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--t3);margin-top:2px}
.vlab b{color:var(--t2)}
/* записи клиента */
.vvis{display:flex;flex-direction:column;gap:10px}
.vv{border-radius:20px;overflow:hidden;background:linear-gradient(160deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line)}
.vvh{display:flex;align-items:center;gap:10px;padding:11px 10px 10px 14px}
.vmav{width:30px;height:30px;flex-shrink:0;border-radius:15px;display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:750;background:var(--av);color:#0b0b0b}
.vmn{flex:1;min-width:0;display:flex;flex-direction:column}
.vmn b{font-size:14.5px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vmn span{font-size:12px;color:var(--t3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vtm{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums;flex-shrink:0}
.vsv{display:flex;align-items:center;gap:10px;padding:10px 14px;border-top:1px solid var(--sep);font-size:14.5px}
.vsv .n{flex:1;min-width:0}
.vsv .p{font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap}
.vsv.disc .n,.vsv.disc .p{color:var(--ok);font-size:13.5px}
.vx{width:26px;height:26px;flex-shrink:0;border:0;padding:0;border-radius:13px;display:inline-flex;align-items:center;justify-content:center;font:inherit;font-size:16px;line-height:1;color:var(--t3);background:transparent;cursor:pointer}
.vx.armed{color:var(--bad);background:color-mix(in srgb,var(--bad) 14%,transparent)}
.vadd{width:100%;display:flex;align-items:center;gap:10px;padding:11px 14px;border:0;border-top:1px solid var(--sep);font:inherit;font-size:14px;font-weight:600;color:var(--t2);background:transparent;text-align:left;cursor:pointer}
.vadd .pl{width:26px;height:26px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:var(--glow);color:var(--fg)}
.vcmt{display:flex;gap:8px;align-items:flex-start;margin:0 12px 12px;padding:9px 12px;border-radius:14px;background:var(--well);font-size:13px;color:var(--t2)}
.vcmt svg{flex-shrink:0;margin-top:1px}
.vrows{display:flex;flex-direction:column;gap:8px}
.vrw{width:100%;display:flex;align-items:center;gap:12px;padding:13px 14px;border:0;border-radius:18px;font:inherit;font-size:14.5px;font-weight:600;color:var(--fg);text-align:left;background:linear-gradient(180deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line);cursor:pointer}
.vrw svg{color:var(--t2);flex-shrink:0}
.vrw span{flex:1}
.vrw i{font-style:normal;color:var(--t3);font-size:18px}
.vsales{display:flex;flex-direction:column;gap:6px}
.vsl{display:flex;align-items:center;gap:10px;padding:10px 8px 10px 14px;border-radius:16px;background:var(--well);font-size:13.5px}
.vsl span{flex:1;min-width:0;color:var(--t2)}
.vsl b{font-variant-numeric:tabular-nums}
/* «К оплате» — всегда внизу листа */
.vpaybar{position:sticky;bottom:0;margin:4px -18px 0;padding:10px 14px calc(16px + env(safe-area-inset-bottom,0px));background:linear-gradient(180deg,transparent,var(--bg1) 28%);z-index:2}
.vpb-in{display:flex;align-items:center;gap:12px;padding:12px 12px 12px 16px;border-radius:22px;background:var(--sheet);box-shadow:inset 0 0 0 1px var(--line),0 -8px 30px rgba(0,0,0,.35)}
.vpb-tx{flex:1;min-width:0;display:flex;flex-direction:column}
.vpb-tx span{font-size:12px;font-weight:600;color:var(--t3)}
.vpb-tx b{font-size:21px;font-weight:800;font-variant-numeric:tabular-nums}
.vpb-btn{height:46px;padding:0 22px;border:0;border-radius:23px;font:inherit;font-size:15px;font-weight:750;background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh);cursor:pointer}
.vpaybar.done .vpb-tx b{color:var(--ok)}
/* добавить услугу */
.spi{width:100%;border:0;background:transparent;color:var(--fg);font:inherit;text-align:left;justify-content:space-between;cursor:pointer}
.spi+.spi{border-top:1px solid var(--sep)}
.spi .n{display:flex;flex-direction:column;gap:2px;font-weight:600}
.spi .n span{font-size:12.5px;color:var(--t3);font-weight:500}
.spi b{font-variant-numeric:tabular-nums;font-weight:650;white-space:nowrap}
.spi.keep{background:color-mix(in srgb,var(--late) 10%,transparent)}
.spi.keep .n span{color:var(--late)}
/* история */
.htl{align-self:stretch;display:flex;flex-direction:column}
.hti{display:flex;gap:12px;position:relative;padding-bottom:15px}
.hti:before{content:"";position:absolute;left:7px;top:20px;bottom:0;width:2px;background:var(--sep)}
.hti:last-child:before{display:none}
.hti .hd{width:16px;height:16px;flex-shrink:0;margin-top:3px;border-radius:8px;background:color-mix(in srgb,var(--c) 30%,transparent);box-shadow:inset 0 0 0 2px var(--c)}
.hti .hx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.hti .hx b{font-size:14.5px;font-weight:650;line-height:1.3}
.hti .hx span{font-size:12.5px;color:var(--t3)}
.hti .hw{font-size:12px;color:var(--t3);font-variant-numeric:tabular-nums;white-space:nowrap;padding-top:2px}
/* перенос */
.mvdays{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 -18px;padding:2px 18px 4px}
.mvdays::-webkit-scrollbar{display:none}
.mvd{flex:0 0 auto;width:48px;height:56px;border:0;padding:0;border-radius:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font:inherit;color:var(--fg);background:linear-gradient(180deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line);cursor:pointer}
.mvd i{font-style:normal;font-size:10.5px;font-weight:650;letter-spacing:.05em;text-transform:uppercase;color:var(--t3)}
.mvd b{font-size:17px;font-weight:700;font-variant-numeric:tabular-nums}
.mvd.we i{color:color-mix(in srgb,var(--bad) 75%,transparent)}
.mvd.on{background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh)}
.mvd.on i{color:inherit;opacity:.6}
/* оплата */
.ps2{align-items:stretch}
.ps2>*{align-self:stretch}
.ps2 .grab{align-self:center}
.ptot{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:2px 2px 10px;border-bottom:1px solid var(--sep)}
.ptot span{font-size:15px;color:var(--t2);font-weight:600}
.ptot b{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums}
.pquick,.psplit{display:flex;flex-direction:column;gap:12px}
.pquick.hidden,.psplit.hidden{display:none}
.pgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pgrid3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pm{border:0;border-radius:20px;padding:16px 14px;display:flex;flex-direction:column;align-items:flex-start;gap:4px;font:inherit;text-align:left;background:var(--sel-bg);color:var(--sel-fg);box-shadow:var(--sel-sh);cursor:pointer}
.pm .ic{width:34px;height:34px;border-radius:17px;display:flex;align-items:center;justify-content:center;background:rgba(127,127,127,.14);margin-bottom:6px}
.pm b{font-size:16px;font-weight:750}
.pm>span:not(.ic):not(.pmw),.pm .pmw span{font-size:12.5px;opacity:.6;font-weight:600}
.pm .pmw b{font-size:16px;font-weight:750}
.pm.wide{grid-column:1/-1;flex-direction:row;align-items:center;gap:12px;padding:14px}
.pm.wide .ic{margin:0}
.pmw{display:flex;flex-direction:column;gap:2px}
.pgrid3 .pm{padding:13px 8px;align-items:center;text-align:center}
.pgrid3 .pm .ic{margin-bottom:4px}
.pgrid3 .pm b{font-size:14px}
.pm2{height:52px;border:0;border-radius:18px;display:flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-size:15px;font-weight:650;color:var(--fg);background:linear-gradient(180deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line);cursor:pointer}
.pnote{font-size:12px;color:var(--t3);text-align:center;line-height:1.4;padding:0 6px}
.prog{border-radius:18px;padding:12px 14px;display:flex;flex-direction:column;gap:9px;background:linear-gradient(180deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line)}
.prog .pr{display:flex;justify-content:space-between;font-size:14px;font-variant-numeric:tabular-nums}
.prog .pr span{color:var(--t2)}
.pbar{height:8px;border-radius:4px;background:var(--well);overflow:hidden}
.pbar i{display:block;height:100%;background:var(--ok);border-radius:4px;transition:width .4s}
.ppart{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--t2)}
.ppart .pd{width:8px;height:8px;border-radius:4px;background:var(--ok)}
.ppart .pd.card,.ppart .pd.transfer{background:var(--gb)}
.ppart span{flex:1}
.ppart b{color:var(--fg);font-variant-numeric:tabular-nums}
.pamt{height:62px;border-radius:18px;padding:0 16px;display:flex;align-items:center;gap:10px;background:var(--well);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--late) 70%,transparent),0 0 0 4px color-mix(in srgb,var(--late) 12%,transparent)}
.pamt input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--fg);font:inherit;font-size:26px;font-weight:800;font-variant-numeric:tabular-nums}
.pamt span{color:var(--t3);font-weight:600}
@media (min-width:1024px){.vpaybar{margin:4px -32px 0;padding-left:28px;padding-right:28px}}
.vs2>.vrows{margin-bottom:14px}

/* ===== 18.10 (7) сотрудники: роли и права ===== */
.stnote{font-size:12.5px;text-align:center}
#stSeg button b{font-weight:600;opacity:.55;margin-left:3px}
.sr2{position:relative;display:flex;flex-direction:column;gap:8px;padding:12px 14px;cursor:pointer}
.sr2+.sr2{box-shadow:inset 0 1px 0 var(--sep)}
.sr2.off .srm{opacity:.55}
.srt{display:flex;align-items:flex-start;gap:10px}
.srm{flex:1;min-width:0;display:flex;align-items:center;gap:12px;padding:4px 0;margin:-4px 0;border:0;background:none;color:var(--fg);font:inherit;text-align:left;cursor:pointer}
.srm .mid{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.srm .mid b{font-size:16px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.srm .mid span{font-size:13px;color:var(--t2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sav2{position:relative;width:46px;height:46px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:750;background:var(--av);color:#0b0b0b}
.sav2 img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.sav2.dk{background:var(--gl3);color:var(--fg);box-shadow:inset 0 0 0 1px var(--line)}
.tgb{position:absolute;right:-3px;bottom:-3px;width:18px;height:18px;border-radius:50%;background:#2aa1de;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 2.5px var(--bg1)}
.sonl{display:flex;flex-direction:column;align-items:center;gap:3px;flex-shrink:0;padding-top:1px}
.sonl em{font-style:normal;font-size:10.5px;font-weight:650;color:var(--t3)}
.sonl .sw:disabled{opacity:.4;cursor:default}
.sfacts{display:flex;flex-wrap:wrap;gap:6px;padding-left:58px}
.sfacts:empty{display:none}
.sfacts>span,.sfacts>button{height:26px;padding:0 10px;border:0;border-radius:13px;display:inline-flex;align-items:center;font:inherit;font-size:12px;font-weight:600;white-space:nowrap;color:var(--t2);background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line)}
.sfacts>button{cursor:pointer}
.sfacts .ok{color:var(--ok)}
.sfacts .warn{color:var(--late);background:color-mix(in srgb,var(--late) 12%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--late) 40%,transparent)}
.sfacts .inv{color:var(--sel-fg);background:var(--sel-bg);box-shadow:none}
.roles3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.rolec{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-height:94px;padding:11px 10px 10px;border:0;border-radius:18px;font:inherit;text-align:left;color:var(--fg);background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line);cursor:pointer}
.rolec .ri{width:30px;height:30px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--t2);background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line)}
.rolec b{font-size:13.5px;font-weight:700;line-height:1.15;overflow-wrap:anywhere;hyphens:auto}
.rolec>span:last-child{font-size:11px;line-height:1.25;color:var(--t3)}
.rolec.on{background:color-mix(in srgb,var(--fg) 12%,transparent);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--fg) 70%,transparent)}
.rolec.on .ri{background:var(--sel-bg);color:var(--sel-fg);box-shadow:none}
.vwnote{padding:11px 13px;border-radius:16px;font-size:13px;line-height:1.45;color:var(--fg);background:color-mix(in srgb,var(--gb) 10%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gb) 30%,transparent)}
.rlab{display:flex;align-items:center;gap:8px}
.rlab i{flex:1}
.rlab span:last-child{letter-spacing:0;text-transform:none;font-family:var(--f-text);font-size:12px;color:var(--t3)}
.li.rtr{gap:12px;padding:11px 14px;min-height:34px}
.rtr .rti{width:32px;height:32px;border-radius:10px;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--t2);background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line)}
.rtr .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.rtr .tx b{font-size:14.5px;font-weight:650}
.rtr .tx span{font-size:12px;line-height:1.3;color:var(--t3)}
.rtr .sw:disabled{opacity:.45;cursor:default}
/* карточка визита: «только просмотр» и чужая запись — статус и заметка без правки */
.vseg.ro button{cursor:default}
.vseg.ro button:not(.on){opacity:.55}
.vnote.ro textarea{cursor:default}

/* ===== 18.10 (8) удалить бизнес ===== */
.delbiz{display:flex;align-items:center;gap:12px;width:100%;padding:14px 16px;border:0;border-radius:20px;font:inherit;text-align:left;color:var(--bad);background:color-mix(in srgb,var(--bad) 9%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--bad) 32%,transparent);cursor:pointer}
.delbiz span{display:flex;flex-direction:column;gap:2px}
.delbiz b{font-size:15.5px;font-weight:650}
.delbiz small{font-size:12.5px;color:var(--t3)}
.dbwarn{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:16px;font-size:14px;line-height:1.45;color:var(--fg);background:color-mix(in srgb,var(--bad) 10%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--bad) 30%,transparent)}
.dbwarn svg{flex-shrink:0;color:var(--bad);margin-top:1px}
.dbok{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--ok);background:color-mix(in srgb,var(--ok) 14%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ok) 40%,transparent)}
.cta.danger{background:linear-gradient(180deg,#ff8a8a,#e25c5c);color:#1a0505;box-shadow:0 12px 30px -10px rgba(226,92,92,.5)}
.cta.danger:disabled{opacity:.45}

/* ===== 18.10 (9) филиалы: выбор филиала клиентом, переключатель, «Новый филиал» ===== */
.nphero{display:flex;align-items:center;gap:14px;padding:6px 2px 2px}
.nplogo{width:60px;height:60px;border-radius:18px;flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden;font-size:20px;font-weight:750;letter-spacing:.02em;color:var(--sel-fg);background:var(--sel-bg);box-shadow:var(--sel-sh)}
.nplogo img{width:100%;height:100%;object-fit:cover}
.nphero .tx{display:flex;flex-direction:column;gap:3px;min-width:0}
.nphero h1{margin:0;font-size:30px;line-height:1.1;overflow-wrap:anywhere}
.nphero .t2{font-size:14.5px}
.brlist .li.brrow{padding:0;gap:0;align-items:stretch}
.brlist .li.brrow+.li.brrow::before{left:64px}
.brpin{width:64px;flex-shrink:0;display:flex;align-items:flex-start;justify-content:center;padding:18px 0 0;border:0;background:none;color:var(--bad);cursor:pointer}
.brpin svg{width:40px;height:40px;padding:10px;border-radius:13px;box-sizing:border-box;background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line)}
.brmain{flex:1;min-width:0;display:flex;align-items:center;gap:10px;padding:14px 16px 14px 0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.brmain .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.brmain .tx b,.sbrow .tx b{font-size:16.5px;font-weight:700;overflow-wrap:anywhere}
.brmain .tx .t2{font-size:13.5px}
.brchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.brchips .st{white-space:normal;line-height:1.3}
.brmain .chev,.sbrow .chev{color:var(--t3);flex-shrink:0}
.brcur{color:var(--ok);flex-shrink:0;display:flex}
.brrow.cur .brmain{cursor:default}
.brmap{align-self:stretch;justify-content:center;gap:8px;height:50px;font-size:15px;font-weight:650}
.brhint{text-align:center;font-size:13px;padding:0 10px}
.brpill{cursor:pointer;gap:6px}
.brpill svg:last-child{opacity:.6}
.sbrow{width:100%;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;gap:12px!important;padding:12px 16px!important;align-items:center!important}
.sbrow .cic{width:38px;height:38px;border-radius:12px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,var(--gl1),var(--gl2));box-shadow:inset 0 0 0 1px var(--line)}
.sbrow.cur .cic{background:var(--sel-bg);color:var(--sel-fg);box-shadow:none}
.sbrow .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.sbrow .tx .t2,.sbrow .tx .t3{font-size:13px}
.brlist .li.sbrow+.li.sbrow::before{left:66px}
.brnew{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:54px;border:0;border-radius:27px;font:inherit;font-size:16px;font-weight:700;color:var(--late);background:color-mix(in srgb,var(--late) 10%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--late) 38%,transparent);cursor:pointer}
.brnew span:first-child{font-size:20px;line-height:1}
#sbSheet,#brSheet{gap:14px}
.nbform{display:flex;flex-direction:column;gap:8px;overflow-y:auto;min-height:0;padding:3px;margin:0 -3px}
.nbform .lab{margin-top:10px}
.nbform .mappt{margin-top:4px}
.nbsub{display:block;font-size:12.5px;margin-top:2px;line-height:1.4}
.nblink{display:flex;align-items:center;gap:0;border-radius:16px;overflow:hidden;background:var(--gl3);box-shadow:inset 0 0 0 1px var(--line)}
.nblink span{padding:0 0 0 14px;font-size:14px;white-space:nowrap}
.nblink .inp{flex:1;min-width:0;background:none;box-shadow:none;padding-left:2px}
.brinfo{margin-top:6px}
.netlink{display:flex;align-items:center;gap:12px;padding:12px 14px;margin:6px 0 2px}
.netlink .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.netlink .tx b{font-size:14.5px;font-weight:650}
.netlink .tx span{font-size:13px}
/* журнал: филиал — на телефоне над датой, на компьютере — в левой колонке */
.jhdw{display:contents}
.jbiz{display:none}
.jbranch{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;border:0;border-radius:22px;font:inherit;text-align:left;color:var(--fg);cursor:pointer}
.jbranch.hidden{display:none}
.jbranch .cic{width:36px;height:36px;border-radius:12px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:var(--sel-bg);color:var(--sel-fg)}
.jbranch .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.jbranch small{font-size:11px;font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--t3)}
.jbranch b{font-size:15.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jbranch>svg:last-child{color:var(--t3);flex-shrink:0}
@media (max-width:1023.98px){
  .jhdw{display:flex;flex-direction:column;justify-content:center;flex:1 1 auto;min-width:0;height:100%}
  .jhdw .jhd{flex:0 0 auto;height:auto}
  .jbiz:not(.hidden){display:inline-flex;align-items:center;gap:4px;align-self:flex-start;max-width:100%;min-width:0;padding:2px 0;border:0;background:none;font:inherit;font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--t2);line-height:1.35;cursor:pointer}
  .jbiz span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .jbiz svg{flex-shrink:0;opacity:.7}
  #journal.hasbr .jhd small{display:none}
  #journal.hasbr .jhd-ch{margin-top:0}
  #journal.jcol .jbiz{display:none}
  #jBranch{display:none!important}
}
.spq .splash{display:none!important}
#brSheet>.g,#brSheet>.brmap,#sbSheet>.g,#sbSheet>.note,#sbSheet>.brnew,#nbSheet>.nbform{align-self:stretch}
.leaflet-marker-icon.dim{opacity:.45;transition:opacity .2s}
.inp[readonly]{opacity:.62;cursor:default}
@media (min-width:1024px){#npScroll>.pad{max-width:720px;margin-left:auto;margin-right:auto;width:100%;box-sizing:border-box}}

/* ===== Прозрачное стекло (решение основателя 18.10.2026): как в iOS 26 — без размытия, сквозь кнопки,
   карточки и панели видно то, что сзади. Читаемость держат светлая кромка, лёгкое затемнение под стеклом
   и плавное затемнение панелей к краю экрана. Листы снизу и меню остаются матовыми: в них много текста. ===== */
:root,.scene{--cg1:rgba(255,255,255,.075);--cg2:rgba(255,255,255,.012);--cg3:rgba(255,255,255,.04);--cdim:rgba(0,0,0,.10);
  --crim:rgba(255,255,255,.42);--cline:rgba(255,255,255,.13);--cglow:rgba(255,255,255,.10);--fadeA:rgba(4,4,4,.88);--fadeB:rgba(4,4,4,0);--fadeC:rgba(4,4,4,.97)}
.scene.light{--cg1:rgba(255,255,255,.62);--cg2:rgba(255,255,255,.28);--cg3:rgba(255,255,255,.45);--cdim:rgba(255,255,255,0);
  --crim:rgba(255,255,255,.95);--cline:rgba(0,0,0,.07);--cglow:rgba(255,255,255,.5);--fadeA:rgba(246,243,238,.9);--fadeB:rgba(246,243,238,0);--fadeC:rgba(246,243,238,.98)}
.g,.ap,.pill:not(.on):not(.sel):not(.act){backdrop-filter:none;-webkit-backdrop-filter:none}
.g{background:linear-gradient(155deg,var(--cg1),var(--cg2) 55%,var(--cg3)),var(--cdim);
  box-shadow:inset 0 1px 0 var(--crim),inset 0 0 0 1px var(--cline),inset 0 -14px 26px -20px var(--cglow),var(--gsh)}
.ap{background:linear-gradient(155deg,var(--cg1),var(--cg2)),var(--cdim);box-shadow:inset 0 1px 0 var(--crim),inset 0 0 0 1px var(--cline),0 16px 30px -18px rgba(0,0,0,.6)}
.pill:not(.on):not(.sel):not(.act){background:linear-gradient(180deg,var(--cg1),var(--cg2)),var(--cdim);
  box-shadow:inset 0 1px 0 var(--crim),inset 0 0 0 1px var(--cline),inset 0 -8px 14px -10px var(--cglow),0 8px 20px -12px rgba(0,0,0,.5)}
/* панели сверху и снизу: не размытие, а плавное затемнение к краю — текст панели читается, контент под ней виден */
.navbar::before{background:linear-gradient(180deg,var(--fadeA) 35%,var(--fadeB));backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
.bbar::before,.foot::before{background:linear-gradient(180deg,var(--fadeB),var(--fadeA) 16%,var(--fadeC) 32%);backdrop-filter:none;-webkit-backdrop-filter:none}
.scene.t-pearl{--fadeA:rgba(22,14,16,.88);--fadeB:rgba(22,14,16,0);--fadeC:rgba(22,14,16,.97)}
.scene.t-pearl.light{--fadeA:rgba(255,249,247,.9);--fadeB:rgba(255,249,247,0);--fadeC:rgba(255,249,247,.98)}
.scene.t-clinic{--fadeA:rgba(8,20,24,.88);--fadeB:rgba(8,20,24,0);--fadeC:rgba(8,20,24,.97)}
.scene.t-clinic.light{--fadeA:rgba(250,253,253,.9);--fadeB:rgba(250,253,253,0);--fadeC:rgba(250,253,253,.98)}
/* фото бизнеса фоном за экранами (первое фото работ), затемнено — стекло его показывает; без фото — прежний тёмный фон.
   Фон у каждого экрана свой (а не общий): экраны выезжают друг поверх друга и должны оставаться непрозрачными */
.app{--wallA:rgba(0,0,0,.42);--wallB:rgba(0,0,0,.74);--wallS:rgba(0,0,0,.70);--wallS2:rgba(0,0,0,.86)}
.app.light{--wallA:rgba(246,243,238,.70);--wallB:rgba(246,243,238,.88);--wallS:rgba(246,243,238,.84);--wallS2:rgba(246,243,238,.93)}
.app.haswall .screen{background:linear-gradient(180deg,var(--wallA),var(--wallB)),var(--wall) center/cover no-repeat,var(--bg2)}
/* экраны сотрудника — много мелкого текста (журнал, график, кабинет): фото темнее */
.app.haswall #journal.screen,.app.haswall #schedule.screen,.app.haswall #cabinet.screen,.app.haswall #stats.screen,.app.haswall #services.screen,.app.haswall #staffList.screen,.app.haswall #clients.screen,.app.haswall #productsScr.screen,.app.haswall #cashScr.screen,.app.haswall #promosScr.screen,.app.haswall #reviewsScr.screen,.app.haswall #salon.screen{background:linear-gradient(180deg,var(--wallS),var(--wallS2)),var(--wall) center/cover no-repeat,var(--bg2)}
/* светлая тема, пока app.js не поставил фон сам (early.js): широкое окно Telegram Desktop без тёмных полос по краям */
html.pre-light{color-scheme:light}html.pre-light body{background:#ebe6df}
.app.haswall .orb{display:none}
/* свечение заставки остаётся: иначе оно пропадало посреди анимации, когда приходили данные бизнеса с фото */
.app.haswall .splash>.orb{display:block}
.app.haswall [id^=reg].screen{background:radial-gradient(120% 70% at 50% -12%,var(--bg0) 0%,var(--bg1) 55%,var(--bg2) 100%)}
.app.t-pearl{--wallA:rgba(22,14,16,.45);--wallB:rgba(22,14,16,.76);--wallS:rgba(22,14,16,.72);--wallS2:rgba(22,14,16,.88)}
.app.t-pearl.light{--wallA:rgba(255,249,247,.70);--wallB:rgba(255,249,247,.88);--wallS:rgba(255,249,247,.84);--wallS2:rgba(255,249,247,.93)}
.app.t-clinic{--wallA:rgba(8,20,24,.45);--wallB:rgba(8,20,24,.76);--wallS:rgba(8,20,24,.72);--wallS2:rgba(8,20,24,.88)}
.app.t-clinic.light{--wallA:rgba(250,253,253,.70);--wallB:rgba(250,253,253,.88);--wallS:rgba(250,253,253,.84);--wallS2:rgba(250,253,253,.93)}
/* живые подсказки при подключении бизнеса: примеры проявляются по буквам и сменяют друг друга (register.js, livePh) */
.aphw{position:relative}
.aph{position:absolute;inset:0;display:flex;align-items:center;pointer-events:none;color:var(--t3);white-space:nowrap;overflow:hidden;box-sizing:border-box}
.aph.hid{visibility:hidden}
.aph.aph-t{position:static;display:block;white-space:normal;overflow:visible;color:inherit}
.aph .aph-p{opacity:.8}
.aph .w{display:inline-block;white-space:nowrap}
.aph .ch{display:inline-block;opacity:0;transform:translateY(.42em);filter:blur(5px);animation:aphIn .46s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(var(--i) * 55ms)}
.aph .car{display:inline-block;width:2px;height:1.05em;margin-left:3px;border-radius:1px;background:currentColor;opacity:0;vertical-align:-.12em;animation:aphCar 1s steps(1) infinite;animation-delay:calc(var(--i) * 55ms)}
.aph.out .ch{animation:aphOut .34s ease-in forwards;animation-delay:calc(var(--i) * 14ms)}
.aph.out .car,.aph.still .car{display:none}
.aph.still .ch{animation:none;opacity:1;transform:none;filter:none}
@keyframes aphIn{to{opacity:1;transform:none;filter:blur(0)}}
@keyframes aphOut{from{opacity:1;transform:none;filter:blur(0)}to{opacity:0;transform:translateY(-.38em);filter:blur(4px)}}
@keyframes aphCar{0%,49%{opacity:1}50%,100%{opacity:0}}
.aph .aphi{white-space:pre}
.aph.aph-t .aphi{white-space:normal}
/* касса и расходы (cabinet.js, «касса и расходы»): две кассы плитками, итог периода, приход и расход по статьям, лента по дням */
.kboxes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.kbox{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:14px 14px 13px;border-radius:22px;text-align:left;color:inherit;font:inherit;border:0;min-width:0;cursor:pointer}
.kbox:disabled{cursor:default;opacity:1}
.kbox .kic{margin-bottom:6px}
.kbox .kl{font-size:13px;font-weight:600;color:var(--t2)}
.kbox b{font-size:19px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.25;max-width:100%;overflow-wrap:anywhere}
.kbox b.neg{color:var(--bad)}
.kbox .ks{font-size:11.5px;color:var(--t3);line-height:1.3}
.kic{width:34px;height:34px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--gl3);color:var(--fg)}
.kic.sm{width:30px;height:30px}
.ktotal{font-size:13px;padding:0 4px;margin-top:-4px}
.kacts{display:flex;gap:8px;flex-wrap:wrap}
.kacts .pill{flex:1 1 0;min-width:0;justify-content:center;white-space:nowrap}
.knav{display:flex;align-items:center;justify-content:space-between;gap:10px}
.knav b{font-size:15.5px;font-weight:700;text-align:center;min-width:0;overflow-wrap:anywhere}
.knav .pill:disabled{opacity:.35}
.ksum{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border-radius:22px}
.ksum .row b{font-variant-numeric:tabular-nums;font-size:15.5px}
.ksum .ktot{border-top:1px solid var(--sep);padding-top:10px;margin-top:2px;font-weight:700}
.ksum .ktot b{font-size:19px;font-weight:800}
.kpos{color:var(--ok)}
.kneg{color:var(--bad)}
.kbal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 14px;font-size:12.5px}
.kbal b{color:var(--t2);font-weight:600;font-variant-numeric:tabular-nums}
.kbody{display:flex;flex-direction:column;gap:14px;transition:opacity .2s}
.kbody.kload{opacity:.45;pointer-events:none}
.krow{align-items:flex-start}
.krow .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.krow .tx b{font-size:15px;font-weight:600;overflow-wrap:anywhere}
.krow .tx>span:not(.bar){font-size:12.5px;color:var(--t3);line-height:1.4;overflow-wrap:anywhere}
.krow .bar{margin-top:6px}
.krow .kamt{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;padding-top:2px;font-size:15px}
.krow.kin .kamt{color:var(--ok)}
.krow.kdel{opacity:.45}
.krow.kdel .kamt{text-decoration:line-through;color:var(--t3)}
.krow[role=button]{cursor:pointer}
.kday{font-size:12.5px;font-weight:600;margin:12px 4px 6px}
.kfeed>.kday:first-of-type{margin-top:0}
.kfeed>.g+.g{margin-top:10px}
.kempty{display:flex;flex-direction:column;gap:6px;padding:22px 18px;border-radius:22px;text-align:center}
.kempty b{font-size:15.5px}
.kempty span{font-size:13px;color:var(--t3);line-height:1.45}
.kchips .pill{flex:0 0 auto}
.krecdiff{min-height:0;font-size:15px;font-weight:700;border-radius:14px;padding:0 14px;align-self:stretch}
.krecdiff.ok,.krecdiff.short,.krecdiff.extra{padding:11px 14px;background:var(--gl3)}
.krecdiff.ok,.krecdiff.extra{color:var(--ok)}
.krecdiff.short{color:var(--bad)}
@media (min-width:1024px){
  /* касса на компьютере: слева кассы и итог, справа приход, расход и лента */
  #cashScr .scroll>.stack{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);column-gap:32px;row-gap:14px;align-items:start}
  #cashScr .scroll>.stack>*{grid-column:1;min-width:0}
  #cashScr .scroll>.stack>#kBody{grid-column:2;grid-row:1 / span 7}
  #kFoot .foot-in{display:flex;justify-content:flex-start;padding-left:32px;padding-right:32px;box-sizing:border-box}
  #kFoot .ctaw{width:420px}
}
/* листы кассы: поле суммы и итоги — во всю ширину листа (лист выравнивает детей по центру) */
#kOpSheet>.pamt,#kRecSheet>.ptot,#kRecSheet>.note,#kDetSheet>.ptot{align-self:stretch}
/* журнал: мастер в эти часы работает в другом филиале сети (staff.js, «занят в другом филиале») */
.gaway{position:absolute;left:3px;right:3px;border-radius:12px;background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--late) 16%,transparent) 0 6px,transparent 6px 12px);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--late) 38%,transparent);cursor:not-allowed;overflow:hidden}
.gaway span{position:absolute;left:8px;right:6px;top:5px;font-size:11px;font-weight:600;color:var(--late);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jnode .ap.free.away{color:var(--late);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--late) 38%,transparent);padding:13px 16px;font-size:13px}
/* филиалы: итоги сегодняшнего дня в переключателе */
.brtoday{font-size:12.5px;color:var(--t2);font-variant-numeric:tabular-nums}
.brnet{display:flex;flex-direction:column;gap:3px;padding:12px 16px;border-radius:18px;align-self:stretch}
.brnet b{font-size:14px}
.brnet span{font-size:13px;color:var(--t2);font-variant-numeric:tabular-nums}

/* журнал: шапка колонки — меню дня мастера */
button.gh{border:0;border-left:1px solid var(--sep);background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;width:100%;position:relative}
button.gh .gn{flex:1 1 auto}
.gh .ghm{flex-shrink:0;color:var(--t3);opacity:.8}
button.gh:focus-visible{outline:2px solid var(--fg);outline-offset:-3px;border-radius:10px}
/* перенос перетаскиванием */
.gc.dg{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
/* поднятая запись — непрозрачная: поверх других записей текст не смешивается */
.gc.gdrag{z-index:6;pointer-events:none;transform:scale(1.03);box-shadow:0 14px 34px -10px rgba(0,0,0,.6),inset 0 0 0 2px var(--c);transition:top .08s linear,transform .18s;overflow:visible;
  background:linear-gradient(color-mix(in srgb,var(--c) 24%,transparent),color-mix(in srgb,var(--c) 24%,transparent)),var(--mat-strong,#121212);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.gc.gdrag.bad{box-shadow:0 14px 34px -10px rgba(0,0,0,.6),inset 0 0 0 2px var(--bad);
  background:linear-gradient(color-mix(in srgb,var(--bad) 22%,transparent),color-mix(in srgb,var(--bad) 22%,transparent)),var(--mat-strong,#121212)}
.gc .gdt{position:absolute;left:6px;top:-24px;z-index:7;font-style:normal;font-size:12px;font-weight:700;white-space:nowrap;padding:3px 9px;border-radius:9px;background:var(--sel-bg);color:var(--sel-fg);box-shadow:0 6px 16px -6px rgba(0,0,0,.5);font-variant-numeric:tabular-nums}
.gc.bad .gdt{background:var(--bad);color:#1a0505}
.gc.gghost{opacity:.28;pointer-events:none;box-shadow:inset 0 0 0 1.5px var(--c);background:none;border:1.5px dashed transparent}
#jGrid.dragging .gsc{scroll-behavior:auto}
#jGrid.dragging .gcol{cursor:grabbing}
/* подтверждение переноса */
.dgwho{align-self:stretch;font-size:15px;font-weight:650;line-height:1.35}
.dgft{align-self:stretch}
.dgft .li{justify-content:space-between;font-size:15px}
.dgft .li b{text-align:right;font-variant-numeric:tabular-nums}
.dgnote{align-self:stretch;font-size:13px}
.dgno{display:block;width:100%;margin-top:10px;padding:10px;border:0;background:none;color:var(--t2);font:inherit;font-size:15px;font-weight:600;cursor:pointer}
/* меню дня мастера */
.gdt2{display:flex;flex-direction:column;gap:2px;min-width:0}
.gdt2 b{font-size:19px}
.gdt2 .t3{font-size:13px}
.gdhours{align-self:stretch;font-size:14px;color:var(--t2);font-variant-numeric:tabular-nums}
.gdlist{align-self:stretch}
.gdrow{width:100%;text-align:left;border:0;background:none;color:inherit;font:inherit;cursor:pointer}
.gdrow .tx{flex:1;min-width:0}
.gdrow b{font-weight:600}
.gdrow.danger b{color:var(--bad)}
.gdrow .chev{color:var(--t3);flex-shrink:0}
.note.warn{align-self:stretch;color:var(--late);font-size:13px}
/* поиск клиента и фильтр */
.jfind{position:relative;flex:0 0 auto;width:34px;height:34px;border-radius:17px;border:0;display:flex;align-items:center;justify-content:center;background:var(--gl1);box-shadow:inset 0 0 0 1px var(--line);color:var(--fg);cursor:pointer}
.jfind.on::after{content:"";position:absolute;top:5px;right:5px;width:8px;height:8px;border-radius:50%;background:var(--late);box-shadow:0 0 0 2px var(--bg,#0b0b0b)}
@media (min-width:1024px){ .jflt .jfind{order:1} .jflt .jsum{order:2} }   /* компьютер: вид, мастера, лупа, итоги */
#jStats{flex-wrap:wrap;row-gap:6px}   /* фильтр включён — плашка уходит на свою строку, а не за край экрана */
.jfpill{height:26px;display:inline-flex;align-items:center;gap:6px;padding:0 10px;border-radius:13px;border:0;font:inherit;font-size:12px;font-weight:650;color:var(--late);background:color-mix(in srgb,var(--late) 14%,transparent);cursor:pointer;max-width:min(100%,280px);min-width:0;flex-shrink:1}
.jfpill .jfl{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fdq{align-self:stretch;display:flex;align-items:center;gap:10px;padding:0 14px;height:48px;border-radius:16px;background:var(--gl1);box-shadow:inset 0 0 0 1px var(--line);color:var(--t2)}
.fdq input{flex:1;min-width:0;height:100%;border:0;background:none;color:var(--fg);font:inherit;font-size:16px;outline:none}
.fdlist{align-self:stretch;display:flex;flex-direction:column;gap:6px;min-height:60px}
.fdhint{font-size:13.5px;padding:8px 4px}
.fdrow{width:100%;text-align:left;border:0;border-radius:16px;background:var(--gl1);box-shadow:inset 0 0 0 1px var(--line);color:inherit;font:inherit;cursor:pointer;padding:11px 14px}
.fdrow .av,.fchead .av{width:38px;height:38px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;background:var(--gl2);box-shadow:inset 0 0 0 1px var(--line)}
.fdrow .tx,.fchead .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.fdrow .tx b{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fdrow .t3{font-size:12.5px}
.fdnx{font-size:12.5px;font-weight:600;color:var(--ok)}
.fdstat .fst i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;background:var(--c)}
.fcbody{align-self:stretch;display:flex;flex-direction:column;gap:12px}
.fchead{display:flex;align-items:center;gap:12px}
.fchead .tx{font-size:14px}
.fchead a{color:var(--fg);text-decoration:underline;font-variant-numeric:tabular-nums}
.fcnote{display:flex;flex-direction:column;gap:3px;padding:11px 14px;border-radius:14px;background:color-mix(in srgb,var(--late) 10%,transparent);font-size:14px;line-height:1.4;white-space:pre-wrap}
.fcnote .t3{font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;white-space:normal}
.fcrow{width:100%;text-align:left;border:0;background:none;color:inherit;font:inherit;cursor:pointer;padding:12px 14px}
.fcrow .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.fcrow .tx b{font-size:14.5px}
.fcrow .tx .t3{font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fcr{display:flex;flex-direction:column;align-items:flex-end;gap:3px;flex-shrink:0;font-size:12px}
.fcempty{font-size:13px;padding:0 4px}

/* длинные названия услуг в «чипах» (подключение бизнеса, запись клиента) переносятся, а не обрезаются с обеих сторон */
.pill.chip,#wSvcs .pill{white-space:normal;max-width:100%;min-width:0;line-height:1.25;padding-top:8px;padding-bottom:8px;overflow-wrap:anywhere}
/* перенести уже нельзя — кнопка приглушена (нажатие объясняет почему) */
.live .pill.dim{opacity:.5}
/* узкий экран: две кнопки в ряд — текст переносится, а не упирается в края */
#toCal,#toMine{flex:1 1 0;min-width:0;white-space:normal;line-height:1.2;text-align:center;padding-left:12px;padding-right:12px}
.linkbox .lk{flex:1;min-width:0;overflow-wrap:anywhere}.linkbox .pill{flex-shrink:0}
/* шапка «дата и время»: длинный список услуг — в две строки */
.tsum .tx b.ell{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
@media (min-width:1024px){
  /* подтверждение — кнопка по ширине колонки, а не всего экрана */
  #confirm .foot{left:max(0px,calc(50% - 310px));right:max(0px,calc(50% - 310px))}
  /* подключение бизнеса: узкая колонка и кнопка под ней, дни недели — обычного размера */
  .screen[id^="reg"] .scroll>.stack,.screen[id^="reg"] .scroll>.pad.stack{max-width:720px}
  .screen[id^="reg"] .foot{left:max(0px,calc(50% - 360px));right:max(0px,calc(50% - 360px))}
  .daysw{max-width:520px}
}
/* журнал: на время «не пришёл» записали другого — обе карточки видны и нажимаются */
.gc.nsl{right:calc(36% + 6px)}
.gc.nsx{left:auto;right:4px;width:36%;opacity:.8}