:root {
  --bg: #f0eae5; --bg-tint: #e7dfd7; --brown: #51443b; --dark: #1c1814; --line: #d3c7bb; --line-strong: #ad9e90; --accent: #a8754a; --white: #fffdfb;
  --c-consult: #a8754a; --c-extraction: #a4523d; --c-implant: #51443b; --c-perio: #5f7a55; --c-other: #8c7f74;
  --head: "Cormorant SC", Georgia, serif; --body: "Montserrat", system-ui, sans-serif;
  --hour: 60px;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font: 400 14px/1.5 var(--body); color: var(--dark); background: var(--bg); -webkit-font-smoothing: antialiased; }
[hidden] { display: none !important; }
button { font: inherit; color: inherit; cursor: pointer; }
ul { list-style: none; }
h1, h2, h3 { font-family: var(--head); text-transform: uppercase; letter-spacing: .03em; line-height: 1.1; }
.eyebrow { font: 500 11px/1.4 var(--body); letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin-bottom: 10px; }

.btn { display: inline-block; text-align: center; text-decoration: none; font: 500 12px/1 var(--body); letter-spacing: .12em; text-transform: uppercase; padding: 15px 22px; background: var(--brown); color: var(--bg); border: 1px solid var(--brown); transition: background .2s, color .2s; }
.btn:hover { background: var(--dark); border-color: var(--dark); }
.btn--ghost { background: transparent; color: var(--brown); }
.btn--ghost:hover { background: var(--brown); color: var(--bg); }
.btn--sm { padding: 11px 16px; font-size: 11px; }
.btn--danger { background: transparent; color: #a4523d; border-color: #a4523d; }
.btn--danger:hover { background: #a4523d; color: #fff; border-color: #a4523d; }
.link { background: none; border: 0; text-decoration: underline; font-size: 12px; opacity: .75; }
.link:hover { opacity: 1; }
.ibtn { width: 38px; height: 38px; background: var(--white); border: 1px solid var(--line-strong); font-size: 20px; line-height: 1; }
.ibtn:hover { background: var(--brown); color: var(--bg); }

/* вход */
.gate { position: fixed; inset: 0; display: grid; place-items: center; background: var(--brown); z-index: 200; padding: 20px; }
.gate__box { background: var(--bg); padding: 40px 36px; width: min(380px, 100%); display: grid; gap: 16px; text-align: center; }
.gate__box h1 { font-size: 38px; }
.gate__hint { font-size: 13px; opacity: .8; }
.gate input { font: 500 18px var(--body); text-align: left; padding: 14px 16px; border: 1px solid var(--line-strong); background: var(--white); outline: none; }
.gate input:focus { border-color: var(--accent); }
.gate__err { color: #a4523d; font-size: 13px; }

/* шапка */
.demo-banner { background: #fff2c2; color: #5b4a00; font-size: 12px; text-align: center; padding: 8px 16px; border-bottom: 1px solid #e9d17a; }
.top { display: flex; align-items: center; gap: 24px; padding: 0 24px; height: 64px; background: var(--white); border-bottom: 1px solid var(--line-strong); position: sticky; top: 0; z-index: 30; }
.top__brand { font: 700 22px/1 var(--head); text-transform: uppercase; letter-spacing: .05em; display: flex; flex-direction: column; gap: 4px; white-space: nowrap; }
.top__brand span { font: 400 9px/1 var(--body); letter-spacing: .22em; color: var(--accent); }
.tabs { display: flex; gap: 4px; margin-left: 12px; }
.tabs > button { background: none; border: 0; padding: 22px 16px 20px; font: 700 16px/1 var(--head); text-transform: uppercase; letter-spacing: .08em; border-bottom: 2px solid transparent; }
.tabs > button.is-active { border-color: var(--accent); color: var(--accent); }
.top__right { margin-left: auto; display: flex; align-items: center; gap: 18px; }

.page { padding: 24px; max-width: 1400px; margin: 0 auto; }

/* плитки */
.tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px; }
.tile { background: var(--white); border: 1px solid var(--line); padding: 16px 18px; }
.tile b { display: block; font: 700 30px/1 var(--head); margin-bottom: 4px; }
.tile span { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; opacity: .65; }
.tile small { display: block; font-size: 12px; opacity: .8; margin-top: 2px; }

/* тулбар */
.toolbar { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 12px; }
.toolbar__nav { display: flex; gap: 6px; }
.toolbar__title { font-size: 30px; flex: 1; min-width: 200px; text-transform: none; font-weight: 700; }
.seg { display: flex; border: 1px solid var(--line-strong); }
.seg button { background: var(--white); border: 0; padding: 10px 18px; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; }
.seg button + button { border-left: 1px solid var(--line-strong); }
.seg button.is-active { background: var(--brown); color: var(--bg); }
.legend { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 12px; font-size: 12px; }
.legend i { display: inline-block; width: 10px; height: 10px; margin-right: 6px; }

/* календарь: неделя / день */
.cal { background: var(--white); border: 1px solid var(--line-strong); overflow: auto; max-height: max(520px, calc(100vh - 300px)); }
.wk { min-width: 640px; }
.wk[style*="--cols:1"] { min-width: 0; }
.wk__head { display: grid; grid-template-columns: 56px repeat(var(--cols), 1fr); position: sticky; top: 0; background: var(--white); z-index: 5; border-bottom: 1px solid var(--line-strong); }
.wk__day { padding: 10px 6px; text-align: center; border-left: 1px solid var(--line); cursor: pointer; }
.wk__day small { display: block; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; opacity: .6; }
.wk__day b { font: 700 24px/1.1 var(--head); }
.wk__day.is-today b { background: var(--brown); color: var(--bg); padding: 0 9px; display: inline-block; }
.wk__day:hover b { color: var(--accent); }
.wk__day.is-today:hover b { color: var(--bg); }
.wk__body { display: grid; grid-template-columns: 56px repeat(var(--cols), 1fr); position: relative; }
.wk__times div { height: var(--hour); font-size: 10px; text-align: right; padding: 0 8px; opacity: .55; transform: translateY(-7px); }
.wk__col { position: relative; border-left: 1px solid var(--line); background-image: repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--hour) - 1px), var(--line) calc(var(--hour) - 1px), var(--line) var(--hour)); cursor: cell; }
.wk__col.is-today { background-color: #faf4ee; }
.now { position: absolute; left: 0; right: 0; height: 2px; background: #c0392b; z-index: 3; pointer-events: none; }
.now::before { content: ""; position: absolute; left: -4px; top: -3px; width: 8px; height: 8px; border-radius: 50%; background: #c0392b; }

.ev { position: absolute; padding: 4px 7px; overflow: hidden; font-size: 11.5px; line-height: 1.3; cursor: pointer; text-align: left; border: 0; border-left: 3px solid var(--c); background: color-mix(in srgb, var(--c) 15%, #fff); color: var(--dark); z-index: 2; transition: box-shadow .15s, transform .15s; }
.ev:hover { box-shadow: 0 4px 14px rgba(0, 0, 0, .18); z-index: 4; }
.ev b { display: block; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ev span { display: block; opacity: .75; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ev.st-done { background: color-mix(in srgb, var(--c) 8%, #fff); }
.ev.st-done b::before { content: "✓ "; color: var(--c); }
.ev.st-cancelled, .ev.st-noshow { opacity: .5; background: repeating-linear-gradient(45deg, #f4efea, #f4efea 6px, #ece4dc 6px, #ece4dc 12px); }
.ev.st-cancelled b, .ev.st-noshow b { text-decoration: line-through; }

/* календарь: месяц */
.mo { display: grid; grid-template-columns: repeat(7, 1fr); min-width: 640px; }
.mo__h { padding: 10px; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; opacity: .6; text-align: center; border-bottom: 1px solid var(--line-strong); }
.mo__c { min-height: 112px; padding: 6px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); cursor: pointer; display: flex; flex-direction: column; gap: 3px; }
.mo__c:nth-child(7n) { border-right: 0; }
.mo__c:hover { background: #faf4ee; }
.mo__c.is-out { background: #f7f2ed; opacity: .55; }
.mo__n { font: 700 16px/1 var(--head); margin-bottom: 2px; }
.mo__c.is-today .mo__n { background: var(--brown); color: var(--bg); align-self: flex-start; padding: 1px 7px; }
.chip { display: block; width: 100%; text-align: left; border: 0; background: color-mix(in srgb, var(--c) 15%, #fff); border-left: 3px solid var(--c); padding: 2px 5px; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chip.st-cancelled, .chip.st-noshow { opacity: .45; text-decoration: line-through; }
.more { font-size: 11px; opacity: .65; padding-left: 4px; }

/* панель приёма */
.overlay { position: fixed; inset: 0; background: rgba(28, 24, 20, .4); z-index: 90; }
.drawer { position: fixed; top: 0; right: 0; bottom: 0; width: min(460px, 100%); background: var(--bg); z-index: 100; transform: translateX(100%); transition: transform .3s; overflow-y: auto; padding: 28px; box-shadow: -10px 0 40px rgba(0, 0, 0, .2); }
.drawer.is-open { transform: none; }
.drawer__close { position: absolute; top: 14px; right: 16px; background: none; border: 0; font-size: 28px; line-height: 1; }
.badge { display: inline-block; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; padding: 4px 9px; background: var(--c, var(--brown)); color: #fff; margin-bottom: 12px; }
.drawer h3 { font-size: 28px; margin-bottom: 6px; text-transform: none; }
.drawer__when { font-size: 14px; opacity: .8; margin-bottom: 18px; }
.kv { display: grid; grid-template-columns: 110px 1fr; gap: 8px 12px; padding: 16px 0; border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line-strong); margin-bottom: 18px; font-size: 13px; }
.kv dt { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; opacity: .6; padding-top: 3px; }
.kv a { color: var(--accent); }
.status-btns { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 18px; }
.status-btns button { padding: 9px 12px; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; background: var(--white); border: 1px solid var(--line-strong); }
.status-btns button.is-active { background: var(--brown); color: var(--bg); border-color: var(--brown); }
.field-label { display: block; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; opacity: .6; margin-bottom: 6px; }
.settings-form { display: grid; gap: 4px; max-width: 460px; }
.settings-form label:not(:first-child) { margin-top: 12px; }
.settings-hint { margin-top: 14px; font-size: 12.5px; color: #2f9e44; font-weight: 600; }
textarea, .dform input, .dform select, .settings-form input { width: 100%; font: 400 14px/1.5 var(--body); padding: 10px 12px; background: var(--white); border: 1px solid var(--line-strong); color: var(--dark); border-radius: 0; outline: none; }
textarea { resize: vertical; min-height: 90px; }
textarea:focus, .dform input:focus, .dform select:focus, .settings-form input:focus { border-color: var(--accent); }
.drawer__actions { display: flex; gap: 8px; margin-top: 16px; flex-wrap: wrap; }
.saved-hint { font-size: 11px; color: var(--c-perio); height: 16px; margin-top: 4px; }

/* пациенты */
.split { display: grid; grid-template-columns: 340px 1fr; gap: 20px; align-items: start; }
.plist { background: var(--white); border: 1px solid var(--line-strong); position: sticky; top: 84px; max-height: calc(100vh - 110px); display: flex; flex-direction: column; }
.plist__top { display: flex; gap: 8px; padding: 12px; border-bottom: 1px solid var(--line); }
.plist__top input { flex: 1; min-width: 0; font: 400 13px var(--body); padding: 9px 10px; border: 1px solid var(--line-strong); background: var(--bg); outline: none; }
.plist ul { overflow-y: auto; }
.plist li button { display: block; width: 100%; text-align: left; background: none; border: 0; border-bottom: 1px solid var(--line); padding: 13px 16px; }
.plist li button:hover { background: #faf4ee; }
.plist li.is-active button { background: var(--bg-tint); box-shadow: inset 3px 0 0 var(--accent); }
.plist b { display: block; font-weight: 600; }
.plist small { font-size: 12px; opacity: .65; }
.pcard { background: var(--white); border: 1px solid var(--line-strong); padding: 28px; min-height: 400px; }
.pcard__empty { opacity: .6; text-align: center; padding: 80px 20px; }
.pcard__head { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; align-items: flex-start; margin-bottom: 8px; }
.pcard h2 { font-size: 38px; text-transform: none; }
.pcard__meta { font-size: 13px; opacity: .8; margin-bottom: 20px; }
.pcard__meta a { color: var(--accent); }
.pcard__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.alert { background: #fdeee8; border-left: 3px solid #a4523d; padding: 12px 16px; margin-bottom: 20px; font-size: 13px; }
.alert b { display: block; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: #a4523d; margin-bottom: 4px; }
.pstats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); margin-bottom: 24px; }
.pstats div { background: var(--bg); padding: 12px 14px; }
.pstats b { display: block; font: 700 20px/1.1 var(--head); }
.pstats span { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; opacity: .65; }
.pcard h4 { font: 700 20px/1 var(--head); text-transform: uppercase; letter-spacing: .04em; margin: 26px 0 12px; }
.back { display: none; background: none; border: 0; text-decoration: underline; margin-bottom: 14px; }

/* история приёмов */
.tl { position: relative; padding-left: 22px; }
.tl::before { content: ""; position: absolute; left: 5px; top: 8px; bottom: 8px; width: 1px; background: var(--line-strong); }
.visit { position: relative; margin-bottom: 8px; background: var(--bg); border: 1px solid var(--line); }
.visit::before { content: ""; position: absolute; left: -22px; top: 17px; width: 11px; height: 11px; border-radius: 50%; background: var(--c); border: 2px solid var(--white); box-shadow: 0 0 0 1px var(--c); }
.visit summary { list-style: none; cursor: pointer; padding: 12px 40px 12px 14px; position: relative; display: grid; gap: 2px; }
.visit summary::-webkit-details-marker { display: none; }
.visit summary::after { content: "+"; position: absolute; right: 14px; top: 10px; font: 300 24px/1 var(--body); color: var(--accent); transition: transform .2s; }
.visit[open] summary::after { transform: rotate(45deg); }
.visit__date { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; opacity: .65; }
.visit__title { font-weight: 600; }
.visit__tags { font-size: 12px; opacity: .8; }
.visit__body { padding: 4px 14px 16px; border-top: 1px dashed var(--line-strong); }
.visit__body .field-label { margin-top: 12px; }
.visit__body p { white-space: pre-wrap; }
.visit__body .muted { opacity: .55; }
.st { display: inline-block; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; padding: 2px 8px; background: var(--line); margin-left: 6px; }
.st.done { background: #dbe7d6; } .st.planned { background: #d6e5ed; } .st.cancelled, .st.noshow { background: #efd9d2; }
.visit__acts { display: flex; gap: 8px; margin-top: 12px; }

/* диалоги */
dialog { margin: auto; border: 1px solid var(--line-strong); background: var(--bg); padding: 0; width: min(560px, calc(100% - 24px)); max-height: calc(100vh - 24px); overflow: auto; }
dialog::backdrop { background: rgba(28, 24, 20, .5); }
.dform { padding: 28px; display: grid; gap: 14px; }
.dform h3 { font-size: 28px; }
.dform label { display: grid; gap: 5px; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; }
.dform label > input, .dform label > select, .dform label > textarea { text-transform: none; letter-spacing: 0; }
.dform__row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.dform__new { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 12px; background: var(--bg-tint); }
.dform__btns { display: flex; justify-content: flex-end; gap: 8px; margin-top: 4px; }
.dform__err { color: #a4523d; font-size: 13px; }

/* ---------- финансы: доход/расход/прибыль — тёплая, приглушённая палитра в тон сайту ---------- */
:root { --s1: #2b6fb3; --s2: #cf6630; --s3: #1d8f73; --good: #006300; --bad: #b3312f; --muted: #898781; --ink2: #52514e; }
.tiles--fin { grid-template-columns: repeat(4, 1fr); }
.tiles--fin .tile b { font-size: 26px; margin: 4px 0; }
.tiles--fin .tile span { display: block; }
.tile--hero { border-left: 4px solid var(--good); }
.tile--hero.is-bad { border-left-color: var(--bad); }
.tile--hero.is-good b { color: var(--good); } .tile--hero.is-bad b { color: var(--bad); }
.tile--warn { border-left: 4px solid var(--bad); cursor: pointer; }
.tile--warn b { color: var(--bad); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.chip2 { background: var(--white); border: 1px solid var(--line); padding: 7px 12px; font-size: 12px; }
.chip2--warn { border-color: var(--bad); color: var(--bad); }
.panel { background: var(--white); border: 1px solid var(--line-strong); padding: 24px; margin-bottom: 20px; }
.panel > h3 { font-size: 26px; margin-bottom: 14px; }
.panel__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 4px; }
.panel__head h3 { font-size: 26px; }
.panel__sub { font-size: 12px; color: var(--ink2); margin: 4px 0 14px; max-width: 760px; }
.legend--inline { margin: 0; }
.sw { display: inline-block; width: 10px; height: 10px; margin-right: 6px; border-radius: 2px; }
.sw1 { background: var(--s1); } .sw2 { background: var(--s2); }
.chartbox { overflow-x: auto; padding-top: 4px; }
.chartbox__in { position: relative; }
.chartbox svg { display: block; max-width: none; }
.chartbox .g { stroke: #e1e0d9; stroke-width: 1; }
.chartbox .base { stroke: #c3c2b7; }
.chartbox .tk { fill: var(--muted); font: 400 11px var(--body); }
.chartbox .tk--m { fill: var(--ink2); }
.chartbox .b1 { fill: var(--s1); } .chartbox .b2 { fill: var(--s2); }
.chartbox .hit:hover { fill: rgba(81, 68, 59, .06); }
.tip { position: absolute; z-index: 6; background: var(--white); border: 1px solid var(--line-strong); box-shadow: 0 6px 20px rgba(0, 0, 0, .15); padding: 10px 12px; font-size: 12px; line-height: 1.6; pointer-events: none; min-width: 190px; }
.tip b { display: block; margin-bottom: 2px; }
.tip div { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.tip span { font-variant-numeric: tabular-nums; font-weight: 600; }
.tip__p { border-top: 1px solid var(--line); margin-top: 4px; padding-top: 4px; }
.tablewrap { overflow-x: auto; }
.tbl { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.tbl th { text-align: left; font: 500 10px/1.3 var(--body); letter-spacing: .12em; text-transform: uppercase; color: var(--ink2); padding: 10px 12px; border-bottom: 1px solid var(--line-strong); white-space: nowrap; }
.tbl td { padding: 11px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
.tbl .r { text-align: right; white-space: nowrap; }
.tbl .neg { color: var(--bad); }
.tbl .dl { text-align: right; white-space: nowrap; }
.tbl .dl small { display: block; font-size: 11px; opacity: .85; }
.tbl .dl.good { color: var(--good); } .tbl .dl.bad { color: var(--bad); }
.warnnote { display: block; font-size: 10px; color: #8a6d00; }
.tbl--click tbody tr { cursor: pointer; }
.tbl--click tbody tr:hover { background: #faf4ee; }
.kind { font-size: 12px; white-space: nowrap; } .kind.income { color: var(--good); } .kind.expense { color: var(--bad); }
.tag { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; background: var(--bg-tint); padding: 2px 6px; margin-left: 4px; }
.two { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.brk { margin-bottom: 14px; }
.brk__top { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; }
.brk__top b { font-variant-numeric: tabular-nums; }
.brk__bar { height: 8px; background: var(--bg-tint); margin: 5px 0 2px; border-radius: 4px; overflow: hidden; }
.brk__bar i { display: block; height: 100%; border-radius: 0 4px 4px 0; }
.brk__bar .b1 { background: var(--s1); } .brk__bar .b2 { background: var(--s2); }
.brk small { font-size: 11px; color: var(--ink2); }
.brk.is-zero { opacity: .5; }
.empty { opacity: .6; font-size: 13px; padding: 12px 0; }
.seg--sm button { padding: 8px 14px; font-size: 11px; }
.pstats--3 { grid-template-columns: repeat(3, 1fr); margin-bottom: 14px; }
.step { border-bottom: 1px solid var(--line); }
.step:first-child { border-top: 1px solid var(--line); }
.step summary { list-style: none; cursor: pointer; display: flex; gap: 14px; align-items: center; padding: 14px 30px 14px 0; position: relative; }
.step summary::-webkit-details-marker { display: none; }
.step summary::after { content: "+"; position: absolute; right: 6px; font: 300 24px var(--body); color: var(--accent); transition: transform .2s; }
.step[open] summary::after { transform: rotate(45deg); }
.step__n { font: 300 34px/1 var(--head); color: var(--accent); width: 34px; flex: none; }
.step summary b { display: block; font-weight: 600; }
.step summary small { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; opacity: .6; }
.step p { padding: 0 0 12px 48px; font-size: 13px; max-width: 800px; }
.step__eff { color: var(--ink2); }

/* приём: цена, просрочка */
.pricebox { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.pricebox input { width: 160px; font: 400 14px var(--body); padding: 10px 12px; background: var(--white); border: 1px solid var(--line-strong); outline: none; }
.pricebox input:focus { border-color: var(--accent); }
.pricebox input::placeholder, .dform input::placeholder, textarea::placeholder { color: #a39c93; }
.alert--warn { background: #fff2c2; border-left-color: #c99700; } .alert--warn b { color: #8a6d00; }
.ev.is-overdue, .chip.is-overdue { outline: 2px dashed var(--bad); outline-offset: -2px; }
.st.moved { background: #e3dcc7; }
.dform__hint { font-size: 12px; color: var(--ink2); }
.dform__row--2 { grid-template-columns: 1fr 1fr; }
.dform__btns .grow { flex: 1; }
.patacc { margin-top: 4px; padding: 14px 16px; background: var(--bg-tint); border-radius: 14px; }
.patacc__cur { font-size: 12.5px; color: var(--ink2); margin: -2px 0 4px; }
.patacc__link { font-size: 12.5px; color: var(--ink2); margin-bottom: 10px; }
.patacc__link a { color: var(--accent); word-break: break-all; }
.patacc__btns { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.patacc__btns .grow { flex: 1; }
.patacc__hint { font-size: 12.5px; margin-top: 10px; color: #2f9e44; }
.patacc__hint.is-err { color: #a4523d; }

/* справочники */
#catDlg { width: min(680px, calc(100% - 24px)); }
.cat__h { font: 700 20px var(--head); text-transform: uppercase; margin: 18px 0 6px; }
.cat__svc { display: grid; gap: 8px; margin: 8px 0 12px; }
.cat__row { display: grid; grid-template-columns: 38px 1fr 110px auto 38px; gap: 8px; align-items: center; }
.cat__row input[type="color"] { width: 38px; height: 38px; padding: 2px; background: var(--white); border: 1px solid var(--line-strong); }
.cat__row input:not([type]), .cat__row input[type="number"], .cat__add input { width: 100%; font: 400 14px var(--body); padding: 9px 10px; background: var(--white); border: 1px solid var(--line-strong); outline: none; }
.cat__chk { display: flex !important; grid-template-columns: none; align-items: center; gap: 6px; font-size: 12px !important; letter-spacing: 0 !important; text-transform: none !important; white-space: nowrap; }
.cat__chk input { width: 16px; height: 16px; }
.cat__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.tagx { display: inline-flex; align-items: center; gap: 6px; background: var(--white); border: 1px solid var(--line-strong); padding: 5px 6px 5px 10px; font-size: 12px; }
.tagx button { border: 0; background: none; font-size: 16px; line-height: 1; opacity: .6; }
.tagx button:hover { opacity: 1; color: var(--bad); }
.cat__add { display: flex; gap: 8px; }

/* доходы и расходы — отдельные редактируемые таблицы */
.panel--inc { border-top: 3px solid var(--s1); }
.panel--exp { border-top: 3px solid var(--s2); }
.panel__total { font: 700 24px var(--head); margin-left: 8px; font-variant-numeric: tabular-nums; }
.panel__tools { display: flex; gap: 8px; align-items: center; }
.panel__tools select { font: 400 13px var(--body); padding: 9px 10px; background: var(--bg); border: 1px solid var(--line-strong); max-width: 200px; }
.ledger { max-height: 520px; overflow: auto; border: 1px solid var(--line); }
.ledger__t { min-width: 640px; }
.ledger__t thead th { position: sticky; top: 0; z-index: 2; background: var(--white); box-shadow: 0 1px 0 var(--line-strong); }
.ledger__t tfoot td { position: sticky; bottom: 0; z-index: 2; background: var(--white); }
.ledger__t td { padding: 5px 6px; vertical-align: middle; }
.ledger__t th { padding-left: 6px; padding-right: 6px; }
.ledger__t input:not([type="checkbox"]), .ledger__t select { width: 100%; font: 400 13px var(--body); padding: 7px 8px; background: transparent; border: 1px solid transparent; border-radius: 0; color: var(--dark); outline: none; }
.ledger__t tr:hover input, .ledger__t tr:hover select { border-color: var(--line); background: var(--white); }
.ledger__t input:focus, .ledger__t select:focus { border-color: var(--accent) !important; background: var(--white) !important; }
.ledger__t input[type="date"] { min-width: 140px; }
.ledger__t select { min-width: 150px; }
.ledger__t .num { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; min-width: 110px; }
.ledger__t td:first-child { width: 150px; }
.ledger__t .acts { width: 48px; text-align: center; }
.ledger__t .acts .ibtn { width: 30px; height: 30px; font-size: 16px; }
.ledger__t .acts [data-del]:hover { background: var(--bad); border-color: var(--bad); color: #fff; }
.ledger__t tfoot td { border-top: 2px solid var(--line-strong); border-bottom: 0; font-weight: 700; padding-top: 10px; }
.ledger__t tfoot .r { font-variant-numeric: tabular-nums; padding-right: 14px; }
.ledger__t .tag { margin: 0 6px 0 0; }
.panel--inc .ledger__t tfoot td { color: var(--s1); }
.panel--exp .ledger__t tfoot td { color: #b4491f; }

/* план лечения и работы в карточке */
.sec__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin: 26px 0 8px; }
.sec__head h4 { margin: 0 !important; }
.sec__tools { display: flex; gap: 8px; flex-wrap: wrap; }
.stage { border: 1px solid var(--line-strong); margin-bottom: 12px; background: var(--white); }
.stage__head { display: flex; align-items: center; gap: 12px; padding: 10px 12px; background: var(--bg); border-bottom: 1px solid var(--line-strong); }
.stage__n { font: 300 28px/1 var(--head); color: var(--accent); width: 26px; text-align: center; flex: none; }
.stage__title { flex: 1; font: 700 18px var(--head); text-transform: uppercase; letter-spacing: .03em; background: transparent; border: 1px solid transparent; padding: 4px 6px; outline: none; color: var(--dark); min-width: 0; }
input.stage__title:hover { border-color: var(--line); background: var(--white); }
input.stage__title:focus { border-color: var(--accent); background: var(--white); }
.stage__sum { font: 700 20px var(--head); font-variant-numeric: tabular-nums; white-space: nowrap; }
.plan__t, .works__t { min-width: 560px; }
.plan__t td, .works__t td { padding: 5px 6px; vertical-align: middle; }
.plan__t th, .works__t th { padding: 8px 6px; }
.plan__t input:not([type="checkbox"]), .plan__t select, .works__t input, .works__t select { width: 100%; font: 400 13px var(--body); padding: 7px 8px; background: transparent; border: 1px solid transparent; border-radius: 0; color: var(--dark); outline: none; }
.plan__t tr:hover input:not([type="checkbox"]), .plan__t tr:hover select, .works__t tr:hover input, .works__t tr:hover select { border-color: var(--line); background: var(--white); }
.plan__t input:focus, .plan__t select:focus, .works__t input:focus, .works__t select:focus { border-color: var(--accent) !important; background: var(--white) !important; }
.plan__t input[type="checkbox"] { width: 18px; height: 18px; accent-color: #3f8a2a; }
.plan__t tr.is-done td { background: #f3f8f0; }
.plan__t tr.is-done select, .plan__t tr.is-done input:not([type="checkbox"]) { color: var(--ink2); text-decoration: line-through; text-decoration-color: rgba(0, 0, 0, .25); }
.plan__t .num, .works__t .num { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; min-width: 96px; }
.plan__t td:first-child { width: 34px; text-align: center; }
.plan__t { table-layout: fixed; }
.plan__t th:nth-child(2), .plan__t td:nth-child(2) { width: 190px; }
.plan__t th:nth-child(3), .plan__t td:nth-child(3) { width: 110px; }
.plan__t td:last-child { width: 130px; }
.works__t td:nth-child(4) { width: 34%; }
.works__t td:nth-child(2) { width: 190px; }
.plan__t .acts, .works__t .acts { white-space: nowrap; text-align: right; }
.plan__t .acts .ibtn, .works__t .acts .ibtn { width: 28px; height: 28px; font-size: 15px; margin-left: 6px; }
.plan__t td.empty { text-align: center; }
.stage > .link { margin: 6px 12px 10px; display: inline-block; }
.plan-total { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; padding: 14px 16px; background: var(--brown); color: var(--bg); margin: 4px 0 0; }
.plan-total span { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
.plan-total b { font: 700 28px var(--head); font-variant-numeric: tabular-nums; }
.plan-total small { font-size: 12px; opacity: .8; margin-left: auto; }
.works__t tfoot td { border-top: 2px solid var(--line-strong); border-bottom: 0; font-weight: 700; padding-top: 10px; }
.works__t tfoot .r { padding-right: 14px; font-variant-numeric: tabular-nums; }
.tag--m { background: #fff2c2; }

/* печать плана */
#printArea { display: none; }
@media print {
  body > *:not(#printArea) { display: none !important; }
  body { background: #fff; }
  #printArea { display: block !important; font: 13px/1.5 var(--body); color: #000; padding: 0; }
  #printArea h1 { font-size: 28px; margin-bottom: 10px; }
  #printArea h2 { font-size: 17px; margin: 18px 0 6px; text-transform: none; }
  #printArea table { width: 100%; border-collapse: collapse; }
  #printArea th, #printArea td { border: 1px solid #999; padding: 6px 8px; text-align: left; font-size: 12px; }
  #printArea th { background: #eee; }
  #printArea .r { text-align: right; }
  #printArea .sub td { font-weight: 700; background: #f6f6f6; }
  #printArea .grand { font-size: 18px; font-weight: 700; margin-top: 16px; text-align: right; }
  #printArea .foot { font-size: 10px; color: #444; margin-top: 24px; }
  #printArea .ag-sig i, #printArea .ag-fill i { border-bottom: 1px solid #000; }
  #printArea .ag-parties td { border: 1px solid #999; }
}

/* соглашения на подпись (договор + ИДС + согласие на ПД) */
.agree-dlg { width: min(760px, calc(100% - 24px)); padding: 0; max-height: calc(100vh - 24px); overflow: auto; }
.agree-dlg[open] { animation: dlgIn .5s var(--ease); }
.agree-dlg[open]::backdrop { animation: tfade .4s ease; }
.agree { padding: 26px 30px 24px; }
.agree__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 6px; }
.agree__head h3 { font: 600 30px var(--head); }
.agree__head p { color: var(--ink2); font-size: 13px; }
.agree__hint { background: var(--bg-tint); border-radius: 14px; padding: 10px 14px; font-size: 12.5px; color: var(--ink2); margin: 6px 0 16px; }
.agree__paper { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 26px 30px; max-height: 52vh; overflow: auto; font: 13.5px/1.55 var(--body); color: #1a1a1a; }
.agree__paper h1 { font: 700 21px/1.3 var(--head); margin-bottom: 12px; }
.agree__paper h2 { font: 700 16px var(--head); margin: 20px 0 8px; text-transform: none; }
.agree__paper h2 small { font-weight: 400; font-size: 12px; color: #666; }
.agree__paper p { margin: 0 0 8px; }
.agree__paper mark.todo { background: #fdf1b8; padding: 0 2px; border-radius: 3px; }
.ag-meta { font-size: 13px; }
.ag-sig { display: flex; align-items: baseline; gap: 6px; margin: 10px 0 4px; font-size: 12.5px; color: #333; }
.ag-sig i { flex: 1 1 140px; max-width: 220px; border-bottom: 1px solid #999; height: 14px; }
.ag-sig i.short { flex: 0 0 90px; max-width: 90px; }
.ag-fill i { display: inline-block; border-bottom: 1px solid #999; min-width: 260px; height: 14px; vertical-align: bottom; }
.ag-check { font-size: 13.5px; }
.ag-note { font-size: 11.5px; color: #666; margin-top: 6px; }
.ag-parties { width: 100%; border-collapse: collapse; margin-top: 14px; }
.ag-parties td { width: 50%; border: 1px solid var(--line-strong); padding: 10px 12px; vertical-align: top; font-size: 13px; }
.agree__foot { display: flex; align-items: center; gap: 10px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.agree__foot .grow { flex: 1; }
@media (max-width: 700px) {
  .agree { padding: 18px 12px; }
  .agree__head h3 { font-size: 24px; }
  .agree__paper { padding: 18px 16px; max-height: 46vh; }
  .agree__foot { position: sticky; bottom: 0; background: var(--bg); padding: 12px 0 calc(4px + env(safe-area-inset-bottom)); }
  .agree__foot .btn { flex: 1 1 auto; }
}

/* ассистент, заполненность карточки */
.top__brand em { font-style: normal; }
.role-note { background: #e3edf2; color: #1c4a60; font-size: 12px; text-align: center; padding: 8px 16px; border-bottom: 1px solid #b8d0dc; }
.ro { font-size: 13px; background: var(--white); border: 1px solid var(--line); padding: 10px 12px; margin-bottom: 14px; white-space: pre-wrap; }
.okline { font-size: 13px; color: var(--good); margin-bottom: 14px; }
.plist .only { display: flex; gap: 8px; align-items: center; padding: 9px 14px; font-size: 12px; border-bottom: 1px solid var(--line); cursor: pointer; }
.plist .nm { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.fb { font-style: normal; font-size: 11px; font-weight: 500; padding: 1px 7px; background: #fff2c2; color: #8a6d00; border-radius: 9px; }
.fb.ok { background: #dbe7d6; color: #2d5a1e; }
.fill { background: var(--bg); border: 1px solid var(--line); padding: 12px 16px; margin-bottom: 16px; font-size: 13px; }
.fill__top { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.fill__bar { height: 6px; background: var(--line); margin: 8px 0 6px; border-radius: 3px; overflow: hidden; }
.fill__bar i { display: block; height: 100%; background: #c99700; border-radius: 3px; }
.fill.is-full { border-color: #b7d3ae; } .fill.is-full .fill__bar i { background: #3f8a2a; } .fill.is-full .fill__top span { color: var(--good); }
.fill p { color: var(--ink2); font-size: 12px; }

/* Google Календарь */
.gdot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #c3c2b7; margin-left: 6px; vertical-align: middle; }
.gdot.on { background: #0ca30c; }
.ev--g { background: repeating-linear-gradient(135deg, #f1ece7, #f1ece7 6px, #e6ded6 6px, #e6ded6 12px); border-left-color: #8c7f74; cursor: default; color: var(--ink2); }
.ev--g:hover { box-shadow: none; }
.chip--g { --c: #8c7f74; background: #eee8e2; color: var(--ink2); cursor: default; }
#gDlg { width: min(640px, calc(100% - 24px)); }
.gbox { background: var(--white); border: 1px solid var(--line); padding: 14px 16px; margin-bottom: 10px; font-size: 13px; }
.gbox p + p { margin-top: 6px; }
.gbox--warn { background: #fff8dc; border-color: #e9d17a; }
.gstatus { font-size: 13px; min-height: 20px; }
.gstatus.err { color: var(--bad); }
.glog { font-size: 12px; color: var(--ink2); white-space: pre-line; }
.gform { display: grid; gap: 10px; margin: 10px 0; }
.gform label { display: grid; gap: 4px; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.gform input:not([type="checkbox"]) { font: 400 14px var(--body); padding: 9px 10px; background: var(--white); border: 1px solid var(--line-strong); text-transform: none; letter-spacing: 0; outline: none; width: 100%; }
.gform .cat__chk { text-transform: none; }
.gsteps { font-size: 12.5px; padding-left: 20px; display: grid; gap: 4px; margin-top: 8px; }
.gsteps li { list-style: decimal; }
.gsteps code { background: var(--bg-tint); padding: 1px 5px; font-size: 12px; word-break: break-all; }
.gbtns { display: flex; gap: 8px; flex-wrap: wrap; }

.foot { display: flex; gap: 20px; justify-content: center; padding: 24px; }
.toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); background: var(--dark); color: var(--bg); padding: 12px 20px; font-size: 13px; z-index: 300; }

/* адаптив */
@media (max-width: 900px) {
  .top { padding: 0 12px; gap: 8px; height: 56px; }
  .top__brand { display: none; }
  .tabs { margin-left: 0; flex: 1; } .tabs > button { padding: 18px 8px 16px; font-size: 13px; letter-spacing: .05em; }
  .top__right { gap: 10px; }
  .page { padding: 14px 12px; }
  .tiles { grid-template-columns: 1fr 1fr; }
  .toolbar__title { font-size: 22px; order: 3; flex-basis: 100%; }
  .split { grid-template-columns: minmax(0, 1fr); }
  .pcard, .plist { min-width: 0; }
  .plist { position: static; max-height: none; }
  .split.is-detail .plist { display: none; }
  .split:not(.is-detail) .pcard { display: none; }
  .back { display: inline-block; }
  .pcard { padding: 18px; } .pcard h2 { font-size: 30px; }
  .pstats { grid-template-columns: 1fr 1fr; }
  .dform__row, .dform__row--2 { grid-template-columns: 1fr; }
  .dform__new { grid-template-columns: 1fr; }
  .tiles--fin { grid-template-columns: 1fr 1fr; }
  .tiles--fin .tile b { font-size: 21px; }
  .two { grid-template-columns: 1fr; }
  .panel { padding: 16px; }
  .pstats--3 { grid-template-columns: 1fr; }
  .cat__row { grid-template-columns: 38px 1fr 90px 38px; }
  .cat__chk { grid-column: 2 / 4; }
  .step p { padding-left: 0; }
  .drawer { padding: 22px 18px; }
}
#aDlg { width: min(560px, calc(100% - 24px)); }

/* =====================================================================
   ТЕМА v3 — единый стиль с сайтом (Cormorant Garamond + Manrope, мягкие формы)
   Этот блок переопределяет более ранние правила выше.
   ===================================================================== */
:root {
  --bg: #f6f1ec; --bg-tint: #efe7df; --brown: #51443b; --dark: #211b17; --line: #e4dacf; --line-strong: #d6c8b9;
  --accent: #a8754a; --white: #fffdfb; --ink2: #5d544c;
  --head: "Cormorant Garamond", Georgia, serif; --body: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --shadow: 0 1px 2px rgba(58, 47, 40, .05), 0 14px 34px -16px rgba(58, 47, 40, .25);
  --shadow-lg: 0 2px 4px rgba(58, 47, 40, .06), 0 28px 60px -22px rgba(58, 47, 40, .4);
}
body { font: 400 14.5px/1.55 var(--body); background: var(--bg); }
.ic { width: 1.25em; height: 1.25em; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
h1, h2, h3, h4 { font-family: var(--head); text-transform: none; font-weight: 600; letter-spacing: -.01em; }
.eyebrow { font: 700 11.5px/1.4 var(--body); letter-spacing: .16em; }
.pcard h4, .cat__h { font: 600 24px var(--head); text-transform: none; letter-spacing: -.005em; }

/* кнопки, переключатели, поля */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font: 600 13.5px/1 var(--body); letter-spacing: 0; text-transform: none; padding: 14px 24px; border-radius: 999px; transition: transform .25s var(--ease), background .2s, color .2s, box-shadow .25s; }
.btn:hover { transform: translateY(-1px); }
.btn--sm { padding: 10px 18px; font-size: 13px; }
.btn:not(.btn--ghost):not(.btn--danger):not(.btn--light) { box-shadow: 0 8px 20px -10px rgba(81, 68, 59, .7); }
.link { font-family: var(--body); }
.ibtn { border-radius: 50%; background: var(--white); border-color: var(--line-strong); }
.seg { border-radius: 999px; overflow: hidden; background: var(--white); border-color: var(--line-strong); }
.seg button { text-transform: none; letter-spacing: 0; font: 600 13px var(--body); padding: 10px 18px; }
.seg--sm button { padding: 8px 14px; font-size: 12px; }
.seg button.is-active { background: var(--brown); color: #f6f1ec; }
input, select, textarea { font-family: var(--body); }
textarea, .dform input, .dform select, .gform input:not([type="checkbox"]), .cat__row input:not([type]), .cat__add input, .plist__top input, .panel__tools select, .pricebox input, .settings-form input { border-radius: 12px; }
textarea:focus, .dform input:focus, .dform select:focus, .settings-form input:focus { box-shadow: 0 0 0 3px rgba(65, 125, 151, .15); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* шапка и вкладки */
.demo-banner { font-size: 11.5px; padding: 7px 16px; }
.role-note { font-size: 12px; }
.top { height: 72px; background: rgba(255, 253, 251, .8); backdrop-filter: blur(14px) saturate(1.3); -webkit-backdrop-filter: blur(14px) saturate(1.3); border-bottom: 1px solid var(--line); }
.top__brand { font: 600 26px/1 var(--head); text-transform: none; letter-spacing: -.01em; }
.top__brand span { font: 600 9.5px/1 var(--body); letter-spacing: .14em; text-transform: uppercase; }
.tabs { gap: 4px; padding: 5px; background: var(--bg-tint); border-radius: 999px; margin-left: 18px; }
.tabs > button { display: inline-flex; align-items: center; gap: 8px; padding: 9px 18px; border-radius: 999px; border: 0; font: 600 13.5px/1 var(--body); text-transform: none; letter-spacing: 0; color: var(--ink2); transition: background .25s var(--ease), color .2s; }
.tabs > button .ic { width: 18px; height: 18px; }
.tabs > button:hover { color: var(--dark); }
.tabs > button.is-active { background: var(--brown); color: #f6f1ec; border: 0; box-shadow: 0 6px 14px -8px rgba(81, 68, 59, .8); }
.page { padding: 28px 24px 8px; }
.toolbar__title { font: 600 32px var(--head); letter-spacing: -.01em; }

/* плитки и панели */
.tile, .kpi, .panel, .cc, .cta-line { background: var(--white); border: 1px solid var(--line); border-radius: 24px; box-shadow: 0 1px 2px rgba(58, 47, 40, .03); }
.tile { padding: 18px 22px; }
.tile b { font: 600 32px var(--head); }
.tile span { font: 600 11px var(--body); letter-spacing: .08em; }
.panel { padding: 26px 28px; }
.panel > h3, .panel__head h3 { font-size: 30px; }
.panel--inc { border-top-width: 3px; } .panel--exp { border-top-width: 3px; }
.cal { border-radius: 24px; border-color: var(--line); box-shadow: var(--shadow); }
.wk__day b, .mo__n, .tile b { font-family: var(--head); font-weight: 600; }
.ev { border-radius: 9px; border-left-width: 4px; } .chip { border-radius: 6px; }
.legend { font-size: 12.5px; } .legend i { border-radius: 3px; }
.plist, .pcard { border-radius: 26px; border-color: var(--line); box-shadow: var(--shadow); overflow: hidden; }
.plist li button { transition: background .2s; }
.pcard { padding: 30px; } .pcard h2 { font: 600 42px var(--head); }
.pstats { border-radius: 18px; overflow: hidden; }
.fill, .alert, .ro { border-radius: 16px; }
.stage { border-radius: 22px; overflow: hidden; border-color: var(--line); }
.stage__title { font: 600 22px var(--head); text-transform: none; }
.plan-total { border-radius: 20px; }
.visit { border-radius: 18px; overflow: hidden; }
.tbl th { font: 700 10.5px var(--body); color: var(--ink2); }
.tag, .fb, .st { border-radius: 999px; }
.ledger { border-radius: 18px; }
.drawer { border-radius: 30px 0 0 30px; box-shadow: var(--shadow-lg); }
.drawer h3 { font: 600 34px var(--head); }
.status-btns button { border-radius: 999px; text-transform: none; letter-spacing: 0; font: 600 12.5px var(--body); }
dialog { border-radius: 30px; border: 1px solid var(--line); box-shadow: var(--shadow-lg); background: var(--bg); }
dialog::backdrop { background: rgba(33, 27, 23, .45); backdrop-filter: blur(3px); }
.dform h3 { font: 600 32px var(--head); }
.dform label { font: 700 10.5px var(--body); }
.gbox { border-radius: 16px; }
.toast { border-radius: 999px; padding: 12px 22px; box-shadow: var(--shadow-lg); }

/* вход */
.gate { background: radial-gradient(900px 500px at 85% -10%, rgba(65, 125, 151, .55), transparent 60%), radial-gradient(700px 500px at -10% 110%, rgba(214, 170, 130, .4), transparent 60%), #3a2f28; }
.gate__box { border-radius: 34px; padding: 44px 38px; box-shadow: var(--shadow-lg); background: rgba(246, 241, 236, .97); }
.gate__box h1 { font-size: 46px; }
.gate__logo { width: 60px; height: 60px; border-radius: 20px; background: var(--brown); color: #f6f1ec; display: grid; place-items: center; margin: 0 auto 4px; }
.gate__logo .ic { width: 30px; height: 30px; }
.gate input { border-radius: 16px; }
.gate .btn { width: 100%; padding: 16px; }

/* ===== обзор: показатели ===== */
.kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin-bottom: 20px; }
.kpi { display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; padding: 18px 20px; }
.kpi > div { min-width: 0; }
.kpi span { display: block; font: 700 10.5px/1.3 var(--body); letter-spacing: .09em; text-transform: uppercase; color: var(--ink2); }
.kpi b { display: block; font: 600 30px/1.1 var(--head); margin: 4px 0 2px; letter-spacing: -.01em; white-space: nowrap; }
.kpi .dl { font-size: 11.5px; color: var(--ink2); display: block; line-height: 1.35; }
.dl.good { color: var(--good); } .dl.bad { color: var(--bad); }
.kpi--warn { border-color: #eac0b8; background: #fff8f6; }
.spark { flex: none; margin-bottom: 4px; }

/* ===== цветные панели в цветах сайта (бирюзово-синий акцент и коричневый) ===== */
.brand, .brand--brown { position: relative; overflow: hidden; color: #fff; border: 0 !important; border-radius: 26px;
  background: linear-gradient(140deg, #5a9bb6 0%, #a8754a 42%, #2c5f78 100%); box-shadow: 0 22px 44px -26px rgba(33, 72, 92, .75); }
.brand--brown { background: linear-gradient(140deg, #7a6858 0%, #51443b 48%, #332922 100%); box-shadow: 0 22px 44px -26px rgba(51, 41, 34, .8); }
.brand::before, .brand--brown::before { content: ""; position: absolute; width: 360px; height: 360px; right: -120px; top: -170px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 255, 255, .16), transparent 68%); pointer-events: none; }
.brand h3, .brand--brown h3 { color: #fff; }
.brand header p, .brand--brown header p, .brand .panel__sub, .brand--brown .panel__sub { color: rgba(255, 255, 255, .72); }
.panel.brand, .panel.brand--brown { margin-bottom: 20px; }
.cc.brand header p, .cc.brand--brown header p { color: rgba(255, 255, 255, .72); }
.gg__c small b { font: 700 12.5px var(--body); color: #fff; }
.tile.brand span, .tile.brand small { color: rgba(255, 255, 255, .78); }
.tile.brand b { color: #fff !important; }
.brand .empty, .brand--brown .empty { color: rgba(255, 255, 255, .8); }

/* верхний ряд «Обзора» у врача: стопка показателей + два кольца (месяц и год) */
.kpis.kpis--hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1.55fr) minmax(0, 1.55fr); gap: 20px; }
.hs { display: grid; padding: 6px 24px; }
.hs__r { padding: 16px 0; border-top: 1px solid rgba(255, 255, 255, .16); display: grid; gap: 2px; }
.hs__r:first-child { border-top: 0; }
.hs__r span { font: 700 10.5px/1.3 var(--body); letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, .7); }
.hs__r b { font: 600 32px/1.1 var(--head); letter-spacing: -.01em; white-space: nowrap; }
.hs__r small { font-size: 12px; color: rgba(255, 255, 255, .78); }
.hs__r small.good { color: #b9f0c9; } .hs__r small.bad { color: #ffc3b8; }
.hg { padding: 22px 26px 24px; }
.hg header { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 6px; }
.hg header h3 { font: 700 13px/1.2 var(--body); letter-spacing: .12em; text-transform: uppercase; }
.hg header small { font-size: 12px; color: rgba(255, 255, 255, .7); }
.gg { display: grid; grid-template-columns: minmax(170px, 230px) minmax(0, 1fr); gap: 24px; align-items: center; }
.gg__ring { position: relative; }
.gg__ring svg { width: 100%; height: auto; display: block; overflow: visible; }
.gg__track { stroke: rgba(255, 255, 255, .17); }
.gg__arc { filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .18)); }
.gg__arc.is-anim { animation: ggSweep 1.2s var(--ease) both; }
@keyframes ggSweep { from { stroke-dasharray: 0 var(--C); } }
.gg__c { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; padding: 0 30px; }
.gg__c b { font: 600 clamp(22px, 2.3vw, 32px)/1.05 var(--head); letter-spacing: -.01em; white-space: nowrap; }
.gg__c small { font-size: 11.5px; color: rgba(255, 255, 255, .8); margin-top: 6px; line-height: 1.35; }
.gg__list { display: grid; gap: 14px; min-width: 0; }
.gg__list li div { display: flex; justify-content: space-between; gap: 10px; font-size: 12.5px; margin-bottom: 6px; }
.gg__list li span { color: rgba(255, 255, 255, .82); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gg__list li b { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.gg__list li i { display: block; height: 5px; border-radius: 3px; background: rgba(255, 255, 255, .18); overflow: hidden; }
.gg__list li em { display: block; height: 100%; border-radius: 3px; background: #fff; }
.gg__empty, .gg__note { font-size: 12px; color: rgba(255, 255, 255, .72); }
.gg__note a { color: #fff; }

/* список слева + динамика выбранного пункта справа */
.sp { display: grid; grid-template-columns: minmax(200px, 300px) minmax(0, 1fr); gap: 20px; }
.sp__list { display: grid; align-content: start; gap: 6px; max-height: 360px; overflow-y: auto; padding-right: 4px; scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, .35) transparent; }
.sp__it { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 9px 13px; border-radius: 11px; border: 0; background: rgba(255, 255, 255, .1); color: #fff; font: 600 13px var(--body); text-align: left; transition: background .15s, color .15s; }
.sp__it:hover { background: rgba(255, 255, 255, .2); }
.sp__it span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sp__it b { font-weight: 700; font-size: 12px; white-space: nowrap; opacity: .9; font-variant-numeric: tabular-nums; }
.sp__it.is-on { background: #fff; color: #2c4f60; box-shadow: 0 6px 16px -8px rgba(0, 0, 0, .35); }
.brand--brown .sp__it.is-on { color: #3a2f28; }
.sp__main { min-width: 0; background: rgba(255, 255, 255, .08); border-radius: 18px; padding: 16px 18px 12px; }
.sp__head small { display: block; font-size: 12px; color: rgba(255, 255, 255, .75); }
.sp__head b { font: 600 28px/1.15 var(--head); }
.sp__ch { position: relative; overflow: hidden; margin-top: 6px; }
.sp__ch svg { display: block; }
.sp__ch .a-g { stroke: rgba(255, 255, 255, .16); stroke-dasharray: 3 5; }
.sp__ch .a-t { fill: rgba(255, 255, 255, .72); font: 500 11px var(--body); } .sp__ch .a-t--m { fill: rgba(255, 255, 255, .5); }
.sp__ch .a-gd { stroke: rgba(255, 255, 255, .5); stroke-width: 1; }
.sp__ch .hit { cursor: crosshair; }
.sp__ch .ch__tip { color: var(--dark); }
.sp__note { font-size: 11px; color: rgba(255, 255, 255, .6); margin-top: 4px; }
.sp__empty { padding: 20px 0; }
@media (max-width: 1240px) { .kpis.kpis--hero { grid-template-columns: 1fr 1fr; } .kpis.kpis--hero .hs { grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 20px; } .kpis.kpis--hero .hs__r { border-top: 0; } }
@media (max-width: 900px) { .kpis.kpis--hero { grid-template-columns: 1fr; } .sp { grid-template-columns: 1fr; } .sp__list { max-height: 210px; } }
@media (max-width: 560px) { .kpis.kpis--hero .hs { grid-template-columns: 1fr; } .kpis.kpis--hero .hs__r { border-top: 1px solid rgba(255, 255, 255, .16); } .kpis.kpis--hero .hs__r:first-child { border-top: 0; } .gg { grid-template-columns: 1fr; } .gg__ring { max-width: 230px; margin: 0 auto; } }
@media (prefers-reduced-motion: reduce) { .gg__arc { animation: none !important; } }

/* ===== обзор: сетка карточек ===== */
.ov-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 20px; }
.cc { grid-column: span 6; padding: 24px 26px 22px; min-width: 0; }
.cc--12 { grid-column: span 12; } .cc--8 { grid-column: span 8; } .cc--4 { grid-column: span 4; }
.cc header { margin-bottom: 14px; }
.cc h3 { font: 600 26px/1.1 var(--head); }
.cc header p { font-size: 12.5px; color: var(--ink2); margin-top: 4px; max-width: 640px; }

/* графики */
.ch__lg { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.ch__k { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 10px; border-radius: 999px; border: 1px solid var(--line); background: var(--white); font: 600 12.5px var(--body); color: var(--dark); cursor: pointer; transition: opacity .2s, background .2s; }
.ch__k:hover { background: var(--bg-tint); }
.ch__k i { width: 11px; height: 11px; border-radius: 4px; }
.ch__k.is-off { opacity: .45; } .ch__k.is-off span, .ch__k.is-off { text-decoration: line-through; }
.ch__sc { overflow-x: auto; }
.ch__in { position: relative; }
.ch svg { display: block; max-width: none; }
.ch .g { stroke: #ebe3da; stroke-width: 1; stroke-dasharray: 3 4; } .ch .base { stroke: #cbbfb1; stroke-dasharray: none; }
.ch .tk { fill: #8f877f; font: 500 11px var(--body); } .ch .tk--m { fill: #5d544c; }
.ch .gd { fill: rgba(81, 68, 59, .06); }
.ch .hit { cursor: crosshair; }
.ch__tip { position: absolute; z-index: 8; min-width: 176px; background: var(--white); border: 1px solid var(--line-strong); border-radius: 14px; box-shadow: var(--shadow-lg); padding: 10px 13px; font-size: 12.5px; line-height: 1.6; pointer-events: none; }
.ch__tip[hidden] { display: none; }
.ch__tip b { display: block; margin-bottom: 2px; font-weight: 700; }
.ch__tip div { display: flex; align-items: center; gap: 8px; }
.ch__tip i { width: 10px; height: 10px; border-radius: 3px; flex: none; }
.ch__tip span { margin-left: auto; padding-left: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
.ch__tv { margin-top: 8px; font-size: 12px; color: var(--ink2); }
.ch__tv summary { cursor: pointer; padding: 4px 0; }
.ch__tv .tbl { margin-top: 6px; }
.ch__in.is-anim .bar { transform-box: fill-box; transform-origin: 50% 100%; animation: grow .8s var(--ease) both; animation-delay: calc(var(--i) * 35ms); }
.ch__in.is-anim .bar.neg { transform-origin: 50% 0; }
.ch__in.is-anim .ln { stroke-dasharray: 1; stroke-dashoffset: 1; animation: draw 1.1s .15s var(--ease) forwards; }
.ch__in.is-anim .ar { animation: fade .9s .3s ease both; }
.ch__in.is-anim .pt { animation: fade .5s 1s ease both; }
.ch .hov circle { pointer-events: none; }
@keyframes grow { from { transform: scaleY(0); } }
@keyframes draw { to { stroke-dashoffset: 0; } }
@keyframes fade { from { opacity: 0; } }

/* кольцевая диаграмма */
.dn__w { display: flex; flex-wrap: wrap; gap: 20px 26px; align-items: center; }
.dn__svg { position: relative; width: 190px; flex: none; }
.dn__svg svg { width: 100%; height: auto; display: block; }
.dn__a { transition: opacity .2s; cursor: pointer; }
.dn__a.dim { opacity: .28; }
.dn__w.is-anim .dn__a { animation: sweep .9s var(--ease) both; animation-delay: var(--d); }
@keyframes sweep { from { stroke-dasharray: 0 var(--C); } }
.dn__c { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; padding: 0 34px; pointer-events: none; }
.dn__c b { font: 600 21px/1.15 var(--head); letter-spacing: -.01em; }
.dn__c small { font-size: 10.5px; color: var(--ink2); line-height: 1.3; }
.dn__lg { flex: 1 1 180px; min-width: 0; display: grid; gap: 2px; }
.dn__lg li { display: grid; grid-template-columns: 12px 1fr auto 42px; gap: 10px; align-items: center; padding: 6px 8px; border-radius: 10px; font-size: 13px; transition: opacity .2s, background .2s; cursor: default; }
.dn__lg li:hover { background: var(--bg-tint); }
.dn__lg li.dim { opacity: .4; }
.dn__lg i { width: 12px; height: 12px; border-radius: 4px; }
.dn__lg span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dn__lg b { font-weight: 700; font-variant-numeric: tabular-nums; }
.dn__lg em { font-style: normal; color: var(--ink2); font-size: 12px; text-align: right; }

/* кольцо «план/факт» */
.ring { position: relative; width: 128px; height: 128px; margin: 0 auto; flex: none; }
.ring svg { width: 100%; height: 100%; display: block; }
.ring__bg { stroke: var(--bg-tint); }
.ring__a.is-anim { animation: ringSweep 1s var(--ease) both; }
@keyframes ringSweep { from { stroke-dashoffset: var(--C); } }
.ring__c { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; }
.ring__c b { font: 700 24px/1 var(--head); letter-spacing: -.01em; }
.ring__c small { display: block; font-size: 10px; color: var(--ink2); margin-top: 2px; }

/* карточки план/факт (в духе примера с дашбордом) */
.plancard { display: grid; gap: 14px; padding: 20px; background: var(--white); border: 1px solid var(--line); border-radius: 24px; box-shadow: 0 1px 2px rgba(58, 47, 40, .03); text-align: center; }
.plancard__rows { display: grid; gap: 6px; text-align: left; font-size: 13px; }
.plancard__rows div { display: flex; justify-content: space-between; gap: 10px; padding: 3px 0; }
.plancard__rows span { color: var(--ink2); }
.plancard__rows b { font-variant-numeric: tabular-nums; }
.plancard__diff.good { color: var(--good); } .plancard__diff.bad { color: var(--bad); }
.plangrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; }
.plan-empty { padding: 28px 16px; text-align: center; color: var(--ink2); }

/* карточка с двумя блоками полос (работа в клиниках) */
.cc h4 { font: 700 10.5px/1.3 var(--body); letter-spacing: .09em; text-transform: uppercase; color: var(--ink2); margin: 2px 0 10px; }
.cc h4 + div + h4 { margin-top: 18px; padding-top: 16px; border-top: 1px dashed var(--line); }

/* тепловая карта */
.ht { position: relative; }
.ht__g { display: grid; grid-template-columns: 30px repeat(var(--cols), minmax(0, 1fr)); gap: 3px; align-items: center; }
.ht__g em { font-style: normal; font-size: 10.5px; color: var(--ink2); text-align: center; }
.ht__g .ht__r { text-align: left; font-weight: 700; }
.ht__c { aspect-ratio: 1.15; min-width: 0; border: 1px solid transparent; background: #f5f0ea; border-radius: 7px; font: 700 11px var(--body); color: var(--dark); cursor: pointer; padding: 0; transition: transform .15s; }
.ht__c:hover { transform: scale(1.12); position: relative; z-index: 2; box-shadow: 0 4px 12px rgba(0, 0, 0, .18); }
.ht__c.dk { color: #fff; border-color: transparent; }
.ht__lg { display: flex; align-items: center; gap: 4px; margin-top: 12px; font-size: 11px; color: var(--ink2); }
.ht__lg i { width: 22px; height: 10px; border-radius: 3px; }
.ht__lg span:first-child { margin-right: 4px; } .ht__lg span:last-child { margin-left: 4px; }

/* горизонтальные полосы и список */
.hb__r { margin-bottom: 13px; } .hb__t { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; margin-bottom: 4px; }
.hb__t b { font-variant-numeric: tabular-nums; }
.hb__b { height: 9px; background: var(--bg-tint); border-radius: 5px; overflow: hidden; }
.hb__b i { display: block; height: 100%; width: 0; border-radius: 0 5px 5px 0; transition: width .9s var(--ease); }
.hb__r.is-zero { opacity: .5; }
.nx li { display: grid; grid-template-columns: 84px 1fr 8px; gap: 16px; align-items: center; padding: 12px 6px; border-bottom: 1px solid var(--line); cursor: pointer; border-radius: 12px; transition: background .2s; }
.nx li:hover { background: var(--bg-tint); }
.nx time { font-size: 11.5px; color: var(--ink2); } .nx time b { display: block; font: 600 22px/1.1 var(--head); color: var(--dark); }
.nx small { display: block; color: var(--ink2); font-size: 12px; }
.nx i { width: 8px; height: 38px; border-radius: 4px; }

@media (prefers-reduced-motion: reduce) {
  .ch__in .bar, .ch__in .ar, .ch__in .pt, .dn__a, .hb__b i { animation: none !important; transition: none !important; }
  .ch__in .ln { animation: none !important; stroke-dasharray: none !important; stroke-dashoffset: 0 !important; }   /* у колец dashoffset — это позиция сегмента, его не трогаем */
  .ring__a { animation: none !important; }
}
@media (max-width: 1240px) { .kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } .spark { display: none; } }
@media (max-width: 1100px) { .cc, .cc--8, .cc--4 { grid-column: span 12; } }
@media (max-width: 900px) {
  .tabs { margin-left: 0; padding: 4px; flex: none; }
  .tabs > button { padding: 9px 12px; }
  .tabs > button:not(.is-active) span { display: none; }
  .top { gap: 10px; }
  .kpis { grid-template-columns: 1fr 1fr; }
  .page { padding: 18px 12px 4px; }
  .cc { padding: 20px 18px; }
  .toolbar__title { font-size: 24px; order: 3; flex-basis: 100%; }
  .drawer { border-radius: 26px 26px 0 0; top: auto; max-height: 92vh; width: 100%; transform: translateY(100%); }
  .drawer.is-open { transform: none; }
}

/* правки вёрстки */
.plist .only b { display: inline; }
.plist .only span { line-height: 1.3; }
#btnNew { white-space: nowrap; }
.foot .foot-access { display: none; }
@media (max-width: 700px) {
  #btnAccess { display: none !important; }
  .foot .foot-access { display: inline; }
  .top__right { gap: 10px; flex: none; }
  .top { padding: 0 10px; }
  .tabs > button { padding: 9px 11px; }
}

/* смены в других клиниках */
.ev--shift { background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--c) 16%, #fff), color-mix(in srgb, var(--c) 16%, #fff) 8px, color-mix(in srgb, var(--c) 8%, #fff) 8px, color-mix(in srgb, var(--c) 8%, #fff) 16px); border-left: 4px solid var(--c); border-radius: 9px; }
.ev--shift b { color: color-mix(in srgb, var(--c) 70%, #000); }
div.ev--shift { cursor: default; }
.chip--shift { background: color-mix(in srgb, var(--c) 16%, #fff); border-left-color: var(--c); border-radius: 6px; }
.legend__sep { color: var(--ink2); font-weight: 700; margin-left: 10px; }
.sq-shift { background: repeating-linear-gradient(135deg, var(--c), var(--c) 3px, #fff 3px, #fff 5px) !important; border: 1px solid var(--c); }
.tag--c { background: #ece4f4; }
.slot__when { font-size: 13px; color: var(--ink2); margin-top: -6px; text-transform: capitalize; }
.slot__btns { display: grid; gap: 10px; }
.slot__b { display: grid; grid-template-columns: 44px 1fr; grid-template-rows: auto auto; column-gap: 14px; align-items: center; text-align: left; padding: 16px 18px; background: var(--white); border: 1px solid var(--line-strong); border-radius: 20px; transition: transform .2s var(--ease), box-shadow .2s, border-color .2s; }
.slot__b:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: var(--accent); }
.slot__b .ic { grid-row: 1 / 3; width: 44px; height: 44px; padding: 11px; border-radius: 14px; background: var(--accent-soft, #dfebf1); color: #2f6580; }
.slot__b b { font: 700 15px var(--body); } .slot__b small { color: var(--ink2); font-size: 12px; }
.repeat { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 14px; background: var(--bg-tint); border-radius: 14px; flex-wrap: wrap; }
.repeat__n { display: flex !important; align-items: center; gap: 10px; text-transform: none !important; letter-spacing: 0 !important; font-size: 12.5px !important; }
.repeat__n input { width: 70px !important; }

/* зубная формула */
.badge-n { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--brown); color: #f6f1ec; font-size: 11px; margin-left: 4px; }
.teeth-dlg { width: min(1120px, calc(100% - 24px)); padding: 0; max-height: calc(100vh - 24px); overflow: auto; }
.teeth { padding: 26px 30px 24px; }
.teeth__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 14px; }
.teeth__head h3 { font: 600 34px var(--head); }
.teeth__head p { color: var(--ink2); font-size: 13px; }
.teeth__legend { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.lg-i { display: inline-flex; align-items: center; gap: 9px; padding: 8px 14px 8px 11px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--white); font: 600 12.5px var(--body); color: var(--dark); transition: background .2s, border-color .2s, transform .2s var(--ease); }
.lg-i:not([disabled]):hover { background: var(--bg-tint); transform: translateY(-1px); }
.lg-i[disabled] { cursor: default; opacity: .9; }
.lg-i.is-on { background: var(--brown); color: #f6f1ec; border-color: var(--brown); box-shadow: 0 6px 14px -8px rgba(81, 68, 59, .8); }
.lg-i i { width: 13px; height: 13px; border-radius: 50%; flex: none; }
.lg-x { color: #e5262a; font-size: 15px; line-height: 1; } .lg-q { color: #7b2d8b; font-size: 16px; line-height: 1; }
.lg-i.is-on .lg-x, .lg-i.is-on .lg-q { color: #fff; }
.teeth__chart { background: var(--white); border: 1px solid var(--line); border-radius: 24px; padding: 8px 6px; }
.teeth__svg { width: 100%; height: auto; display: block; user-select: none; }
.teeth__svg .seg-l text { font: 500 34px "Cormorant Garamond", Georgia, serif; fill: #1f7ea8; }
.teeth__svg .side { font: 600 46px "Cormorant Garamond", Georgia, serif; fill: #1f7ea8; }
.teeth__svg .ml { stroke: #d63a3a; stroke-width: 2; }
.tt { cursor: pointer; outline: none; }
.is-brush .tt { cursor: crosshair; }
.tt-crown, .tt-root { fill: #fff; stroke: #7a6f65; stroke-width: 1.6; stroke-linejoin: round; transition: fill .15s; }
.tt:hover .tt-crown, .tt:hover .tt-root { fill: #eef5f8; }
.tt.is-sel .tt-crown, .tt.is-sel .tt-root { fill: #e3eff5; stroke: var(--accent); stroke-width: 2.6; }
.tt:focus-visible .tt-crown { stroke: var(--accent); stroke-width: 3; }
.tt-n { font: 600 13.5px var(--body); fill: #2b241f; pointer-events: none; }
.tt-x { stroke: #e5262a; stroke-width: 4.5; stroke-linecap: round; fill: none; pointer-events: none; }
.tt-q { font: 700 24px var(--body); fill: #7b2d8b; pointer-events: none; }
.gp { cursor: pointer; }
.gp-dot { fill: #f39c34; stroke: #fff; stroke-width: 1.6; opacity: 0; transition: opacity .15s; }
.gp:hover .gp-dot { opacity: .4; } .gp.on .gp-dot { opacity: 1; }
.is-brush .gp { cursor: crosshair; }
.teeth__panel { margin-top: 14px; }
.teeth__hint { font-size: 13px; color: var(--ink2); padding: 10px 4px; }
.tp { display: flex; align-items: center; gap: 12px 16px; flex-wrap: wrap; background: var(--bg-tint); border-radius: 20px; padding: 14px 18px; }
.tp__n { font: 600 26px var(--head); } .tp__s { font-size: 12px; color: var(--ink2); }
.tp__chips { display: flex; gap: 6px; flex-wrap: wrap; flex: 1 1 320px; }
.chip-mk { display: inline-flex; align-items: center; gap: 8px; padding: 7px 13px 7px 10px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--white); font: 600 12px var(--body); transition: background .2s, border-color .2s; }
.chip-mk:not([disabled]):hover { border-color: var(--accent); }
.chip-mk.is-on { background: #fff; border-color: var(--dark); box-shadow: inset 0 0 0 1px var(--dark); }
.chip-mk[disabled] { cursor: default; }
.chip-mk i { width: 11px; height: 11px; border-radius: 50%; }
.tp__note { flex: 1 1 200px; min-width: 0; font: 400 13px var(--body); padding: 9px 12px; border-radius: 12px; border: 1px solid var(--line-strong); background: var(--white); outline: none; }
.tp__note:focus { border-color: var(--accent); }
.teeth__sum { margin-top: 12px; }
.teeth__sum h4 { font: 600 22px var(--head); margin-bottom: 6px; }
.teeth__sum ul { display: flex; flex-wrap: wrap; gap: 6px 8px; }
.teeth__sum li { background: var(--white); border: 1px solid var(--line); border-radius: 999px; padding: 5px 13px; font-size: 12.5px; }
.teeth__sum li b { margin-right: 4px; } .teeth__sum li em { color: var(--ink2); font-style: normal; }
.sw-c { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #f39c34; margin-right: 6px; }
.teeth__foot { display: flex; align-items: center; gap: 10px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.teeth__foot .grow { flex: 1; }
@media (max-width: 700px) { .teeth { padding: 18px 12px; } .teeth__head h3 { font-size: 26px; } .teeth__chart { border-radius: 16px; overflow-x: auto; } .teeth__svg { min-width: 640px; } .lg-i { padding: 7px 11px 7px 9px; font-size: 12px; } }

/* ===== зубная формула v2: формы, объём и анимация ===== */
.teeth-dlg[open] { animation: dlgIn .55s var(--ease); }
.teeth-dlg[open]::backdrop { animation: tfade .4s ease; }
@keyframes dlgIn { from { opacity: 0; transform: translateY(28px) scale(.97); } }
@keyframes tfade { from { opacity: 0; } }
.teeth__chart { background: radial-gradient(ellipse at 50% 48%, #ffffff 0%, #fbf7f2 62%, #f3ebe2 100%); border-radius: 26px; box-shadow: inset 0 0 0 1px var(--line), 0 18px 40px -26px rgba(58, 47, 40, .5); }

.tt { cursor: pointer; outline: none; }
.is-brush .tt { cursor: crosshair; }
.tt-hit { fill: transparent; }
.tt-root { fill: url(#tg-root); stroke: #8e8175; stroke-width: 1.2; stroke-linejoin: round; }
.tt-crown { fill: url(#tg-crown); stroke: #8e8175; stroke-width: 1.4; stroke-linejoin: round; transition: fill .25s, stroke .25s; }
.tt-shine { fill: none; stroke: #fff; stroke-width: 2.6; stroke-linecap: round; opacity: .9; pointer-events: none; }
.tt-body { filter: drop-shadow(0 2px 2px rgba(80, 60, 40, .2)); transition: opacity .35s; }
/* отсутствующий зуб — тёмно-серая заливка вместо «дырки»: спокойнее для пациента, чем прозрачность */
.tt.ex .tt-crown, .tt.ex .tt-root { fill: #5c5f64; stroke: #46484c; transition: fill .35s, stroke .35s; }
.tt.ex .tt-shine { opacity: .14; }
.tt.ex .tt-n { fill: #f3f1ee; stroke: rgba(35, 35, 38, .6); }
.tt-n { font: 700 13.5px var(--body); fill: #3a2f28; pointer-events: none; paint-order: stroke; stroke: rgba(255, 255, 255, .9); stroke-width: 3px; stroke-linejoin: round; }
.tt-q { font: 700 15px var(--body); fill: #7b2d8b; pointer-events: none; }

/* наведение и выбор */
.tt-hov { transform-box: fill-box; transition: transform .32s cubic-bezier(.34, 1.56, .64, 1), filter .3s; }
.tt-hov.up { transform-origin: 50% 100%; } .tt-hov.lo { transform-origin: 50% 0%; }
.tt:hover .tt-hov.up, .tt:focus-visible .tt-hov.up { transform: translateY(-5px) scale(1.08); }
.tt:hover .tt-hov.lo, .tt:focus-visible .tt-hov.lo { transform: translateY(5px) scale(1.08); }
.tt:hover .tt-crown, .tt:focus-visible .tt-crown { stroke: var(--accent); fill: #f2f8fb; }
.tt.is-sel .tt-crown { fill: #dcecf4; stroke: var(--accent); stroke-width: 2.2; }
.tt.is-sel .tt-root { stroke: var(--accent); stroke-width: 1.8; }
.tt.ex:hover .tt-crown, .tt.ex:focus-visible .tt-crown, .tt.ex.is-sel .tt-crown { fill: #6f7278; stroke: var(--accent); }
.tt.ex.is-sel .tt-root { stroke: var(--accent); }

/* имплант вместо корня — металлический винт с резьбой, как на медицинских иллюстрациях */
.tt-impl-collar { fill: #b6bcc3; stroke: #857464; stroke-width: 1.2; stroke-linejoin: round; }
.tt-impl-shaft { fill: url(#tg-metal); stroke: #857464; stroke-width: 1.3; stroke-linejoin: round; }
.tt-thread { stroke: #5f6369; stroke-width: 1.1; opacity: .75; }
.tt.impl:hover .tt-impl-shaft, .tt.impl:focus-visible .tt-impl-shaft, .tt.impl.is-sel .tt-impl-shaft { stroke: var(--accent); }
.tt.is-sel .tt-hov { animation: selPulse 2.4s ease-in-out infinite; }
@keyframes selPulse { 0%, 100% { filter: drop-shadow(0 0 0 rgba(65, 125, 151, 0)); } 50% { filter: drop-shadow(0 0 8px rgba(65, 125, 151, .7)); } }
.ghost { fill: var(--gc, #e5262a); opacity: 0; pointer-events: none; transition: opacity .15s; stroke: #fff; stroke-width: 2; }
.has-brush .tt:hover .ghost { opacity: .5; }

/* появление схемы: зубы «вырастают» от линии смыкания, затем метки */
.tt-in { transform-box: fill-box; }
.tt-in.up { transform-origin: 50% 100%; --y: -26px; } .tt-in.lo { transform-origin: 50% 0%; --y: 26px; }
.teeth__svg.enter .tt-in { animation: toothIn .75s var(--ease) both; animation-delay: var(--d); }
@keyframes toothIn { from { opacity: 0; transform: translateY(var(--y)) scale(.55); } }
.teeth__svg .ml { stroke: #d63a3a; stroke-width: 2; stroke-linecap: round; stroke-dasharray: 1 1; }
.teeth__svg.enter .ml { animation: tdraw 1.1s var(--ease) both; }
.teeth__svg.enter .seg-l text, .teeth__svg.enter .side { animation: tfade .9s .25s both; }
@keyframes tdraw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }

/* метки: пружинящее «появление» */
.mk { transform-box: fill-box; transform-origin: center; pointer-events: none; }
.teeth__svg.enter .mk { animation: mkPop .65s cubic-bezier(.34, 1.56, .64, 1) both; animation-delay: calc(.95s + var(--i, 0) * .07s); }
.mk.fresh { animation: mkPop .55s cubic-bezier(.34, 1.56, .64, 1) both; animation-delay: calc(var(--i, 0) * .05s); }
@keyframes mkPop { 0% { transform: scale(0) rotate(-40deg); opacity: 0; } 60% { transform: scale(1.4) rotate(6deg); opacity: 1; } 100% { transform: scale(1) rotate(0); opacity: 1; } }
.mk-x path { fill: none; stroke: #e5262a; stroke-width: 4.6; stroke-linecap: round; stroke-dasharray: 1 1; }
.teeth__svg.enter .mk-x path { animation: tdraw .5s ease both; animation-delay: calc(1.05s + var(--dl, 0s)); }
.mk-x.fresh path { animation: tdraw .42s ease both; animation-delay: var(--dl, 0s); }
.mk-x.fresh, .teeth__svg.enter .mk-x { animation: none; }

/* контакты между зубами */
.gp { cursor: pointer; outline: none; }
.is-brush .gp { cursor: crosshair; }
.gp-dot { fill: #f39c34; stroke: #fff; stroke-width: 2; opacity: 0; transform-box: fill-box; transform-origin: center; transition: opacity .2s, transform .3s cubic-bezier(.34, 1.56, .64, 1); }
.gp:hover .gp-dot { opacity: .45; transform: scale(1.2); }
.gp.on .gp-dot { opacity: 1; filter: drop-shadow(0 1px 1px rgba(150, 90, 20, .35)); }
.gp.fresh .gp-dot { animation: mkPop .55s cubic-bezier(.34, 1.56, .64, 1) both; }
.teeth__svg.enter .gp.on .gp-dot { animation: mkPop .65s cubic-bezier(.34, 1.56, .64, 1) both; animation-delay: 1.15s; }

/* панель, сводка, кнопки */
.tp--in { animation: tpIn .42s var(--ease); }
@keyframes tpIn { from { opacity: 0; transform: translateY(12px); } }
.teeth__sum.enter li { animation: liIn .5s var(--ease) both; animation-delay: calc(1.1s + var(--i, 0) * .05s); }
@keyframes liIn { from { opacity: 0; transform: translateY(10px) scale(.94); } }
.teeth__sum .cnt { display: inline-block; }
.lg-i, .chip-mk { transition: background .2s, border-color .2s, transform .2s var(--ease), box-shadow .25s; }
.lg-i:not([disabled]):active, .chip-mk:not([disabled]):active { transform: scale(.95); }
.chip-mk.is-on { animation: chipOn .35s cubic-bezier(.34, 1.56, .64, 1); }
@keyframes chipOn { 0% { transform: scale(.9); } 100% { transform: scale(1); } }
.lg-i.is-on { animation: chipOn .35s cubic-bezier(.34, 1.56, .64, 1); }

@media (prefers-reduced-motion: reduce) {
  .teeth-dlg[open], .teeth-dlg[open]::backdrop, .teeth__svg *, .tp--in, .teeth__sum li, .chip-mk, .lg-i { animation: none !important; transition: none !important; }
  .teeth__svg .ml, .mk-x path { stroke-dashoffset: 0 !important; }
}

/* фотопротокол и дата этапа */
.stage__meta { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 18px; padding: 12px 16px; background: #fbf8f4; border-bottom: 1px solid var(--line); }
.mf { display: grid; gap: 4px; min-width: 0; }
.mf > span:first-child { font: 700 10px var(--body); letter-spacing: .12em; text-transform: uppercase; color: var(--ink2); }
.mf b { font: 600 13px var(--body); }
.mf--grow { flex: 1 1 320px; }
.mf__row { display: flex; align-items: center; gap: 8px; }
.mf input { font: 400 13px var(--body); padding: 8px 10px; border: 1px solid var(--line-strong); border-radius: 12px; background: var(--white); outline: none; min-width: 0; }
.mf input[type="date"] { width: 150px; }
.mf__row input { flex: 1 1 auto; width: 100%; }
.mf input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(65, 125, 151, .15); }
.pl-open { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; padding: 8px 14px; border-radius: 999px; background: var(--accent-soft, #dfebf1); color: #2f6580; font: 600 12.5px var(--body); text-decoration: none; transition: background .2s, transform .2s var(--ease); }
.pl-open:hover { background: #cfe1ea; transform: translateY(-1px); }
.pl-open .ic { width: 16px; height: 16px; }
.stg-st { align-self: center; padding: 5px 12px; border-radius: 999px; font: 700 11.5px var(--body); background: var(--bg-tint); color: var(--ink2); white-space: nowrap; }
.stg-st.ok { background: #dbe7d6; color: #2d5a1e; } .stg-st.warn { background: #fff2c2; color: #8a6d00; } .stg-st.bad { background: #f6dcd6; color: #a4392b; }
.photoline { display: flex; align-items: center; gap: 12px 14px; flex-wrap: wrap; padding: 14px 18px; margin-bottom: 16px; background: var(--white); border: 1px solid var(--line); border-radius: 20px; }
.photoline__ic { width: 44px; height: 44px; border-radius: 14px; background: var(--accent-soft, #dfebf1); color: #2f6580; display: grid; place-items: center; flex: none; }
.photoline__ic .ic { width: 22px; height: 22px; }
.photoline__t { flex: 1 1 200px; min-width: 0; }
.photoline__t b { display: block; font-size: 14px; } .photoline__t small { color: var(--ink2); font-size: 12px; }
.photoline input { flex: 1 1 260px; min-width: 0; font: 400 13px var(--body); padding: 9px 12px; border: 1px solid var(--line-strong); border-radius: 12px; background: var(--white); outline: none; }
.photoline input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(65, 125, 151, .15); }

/* напоминания в Telegram */
.gdot.half { background: #f0b429; }
.tiles { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.ev { }
.rm { position: absolute; top: 4px; right: 5px; font-style: normal; font: 700 10.5px/1 var(--body); width: 16px; height: 16px; display: grid; place-items: center; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); }
.rm--ok { color: #fff; background: #2f9e44; } .rm--bad { color: #fff; background: #d03b3b; } .rm--warn { color: #7a5a00; background: #ffd36b; } .rm--sent { color: #2f6580; background: #dfebf1; }
.rem { display: inline-block; padding: 4px 11px; border-radius: 999px; font: 700 11.5px var(--body); background: var(--bg-tint); color: var(--ink2); white-space: nowrap; }
.rem--ok { background: #dbe7d6; color: #2d5a1e; } .rem--bad { background: #f6dcd6; color: #a4392b; } .rem--warn { background: #fff2c2; color: #8a6d00; } .rem--sent { background: #dfebf1; color: #2f6580; } .rem--off { background: #eee8e2; color: #7a7168; }
.rem-block { background: var(--white); border: 1px solid var(--line); border-radius: 18px; padding: 14px 16px; margin-bottom: 16px; }
.rem-block__t { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.rem-block p { font-size: 12.5px; color: var(--ink2); margin: 8px 0; }
.rem-block .btn { margin-top: 6px; }
.remline { display: flex; align-items: center; gap: 12px 14px; flex-wrap: wrap; padding: 14px 18px; margin-bottom: 12px; background: var(--white); border: 1px solid var(--line); border-radius: 20px; }
.remline .photoline__t b { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.remline .cat__chk { font-size: 12.5px !important; }
#remDlg { width: min(680px, calc(100% - 24px)); }
.rem-prev { background: #e8f1f7; border-radius: 16px; padding: 12px 16px; }
.rem-prev span { font: 700 10.5px var(--body); letter-spacing: .12em; text-transform: uppercase; color: #2f6580; }
.rem-prev pre { white-space: pre-wrap; font: 400 13.5px/1.5 var(--body); margin-top: 6px; }

/* =====================================================================
   МОБИЛЬНАЯ ВЕРСИЯ (телефон, ≤700px): нижняя панель вкладок, крупные цели для пальца,
   таблицы карточками, окна-«шторки». Логика и данные те же, что на компьютере.
   ===================================================================== */
html { -webkit-text-size-adjust: 100%; }
button, a, summary, label, select { touch-action: manipulation; }
* { -webkit-tap-highlight-color: transparent; }
.toolbar__acts { display: contents; }
.mo__dots { display: none; }
.teeth__sides { display: none; }
.gate { grid-template-columns: minmax(0, 1fr); }
.gate__box { width: 100%; max-width: 380px; justify-self: center; }
.teeth__sides button { border: 1px solid var(--line-strong); background: var(--white); border-radius: 16px; padding: 10px 12px; font: 700 13.5px var(--body); display: grid; gap: 2px; text-align: center; transition: background .2s, color .2s, border-color .2s; }
.teeth__sides button small { font: 500 11px var(--body); opacity: .7; }
.teeth__sides button.is-on { background: var(--brown); color: #f6f1ec; border-color: var(--brown); }
@keyframes sheetIn { from { transform: translateY(44px); opacity: 0; } }

@media (max-width: 700px) {
  input, select, textarea, .tp__note, .gate input { font-size: 16px !important; }       /* iPhone не увеличивает экран при вводе */
  .app { padding-bottom: calc(86px + env(safe-area-inset-bottom)); }
  .demo-banner { font-size: 11px; padding: max(6px, env(safe-area-inset-top)) 12px 6px; }
  .gate { padding: 16px; } .gate__box { padding: 32px 22px; }

  /* шапка */
  .top { height: calc(56px + env(safe-area-inset-top)); padding: env(safe-area-inset-top) 12px 0; gap: 8px; justify-content: space-between; background: var(--white); backdrop-filter: none; -webkit-backdrop-filter: none; }
  .top__brand { display: flex !important; font-size: 20px; min-width: 0; }
  .top__brand span { display: block; font-size: 8.5px; letter-spacing: .1em; }
  .top__right { gap: 8px; margin-left: 0; flex: none; }
  /* «+Приём» и «Выйти» физически переехали внутрь #tabs (для панели на компьютере) — на телефоне
     возвращаем их визуально в шапку через position:fixed, саму панель #tabs здесь не показываем как шапку */
  .lava-tooth, .tabs__spacer { display: none; }
  #tabs #btnAccess { display: none; }                 /* дубль этой кнопки есть в подвале, #btnAccessFoot */
  #tabs #btnNew, #tabs #btnLogout { position: fixed; top: calc(8px + env(safe-area-inset-top)); z-index: 71; flex-direction: row; width: auto; margin: 0; }
  #btnNew { min-height: 40px; padding: 0 16px 0 12px; right: 56px; gap: 6px; background: var(--brown); color: #f6f1ec; border-radius: 999px; }
  #btnNew .ic { width: 16px; height: 16px; }
  #tabs #btnNew span { opacity: 1 !important; font: 600 12px var(--body); text-transform: none; }
  #btnLogout { width: 40px; height: 40px; padding: 0; right: 8px; display: grid; place-items: center; border-radius: 50%; background: var(--white); border: 1px solid var(--line-strong); opacity: 1; text-decoration: none; }
  #btnLogout span { display: none; } #btnLogout .ic { width: 20px; height: 20px; }

  /* нижняя панель вкладок */
  /* backdrop-filter здесь не ставим: он создаёт свою систему координат для position:fixed
     потомков (#btnNew/#btnLogout возвращаются в шапку) — фон и так почти непрозрачный */
  .tabs { position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; margin: 0; padding: 6px 8px calc(6px + env(safe-area-inset-bottom)); border-radius: 22px 22px 0 0; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 4px; background: rgba(255, 253, 251, .97); border-top: 1px solid var(--line); box-shadow: 0 -10px 30px -18px rgba(58, 47, 40, .5); }
  .tabs > button { flex-direction: column; justify-content: center; gap: 3px; padding: 8px 2px 7px; min-height: 56px; border-radius: 16px; font-size: 10.5px; letter-spacing: 0; }
  .tabs > button .ic { width: 22px; height: 22px; }
  .tabs > button:not(.is-active) span { display: block !important; }
  .toast { bottom: calc(92px + env(safe-area-inset-bottom)); max-width: calc(100% - 24px); text-align: center; }
  .foot { flex-wrap: wrap; gap: 6px 18px; padding: 16px 12px; } .foot .link { min-height: 40px; }

  /* страницы, плитки, панели показателей */
  .page { padding: 12px 12px 4px; }
  .tiles, .tiles--fin { grid-template-columns: 1fr 1fr !important; gap: 10px; margin-bottom: 14px; }
  .tile { padding: 12px 14px; border-radius: 18px; }
  .tile b { font-size: 24px !important; margin: 2px 0; } .tile span { font-size: 10px; } .tile small { font-size: 11px; }
  .tiles > .tile:last-child:nth-child(odd), .kpis > .kpi:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .kpis { grid-template-columns: 1fr 1fr; gap: 10px; }
  .kpi { padding: 12px 14px; border-radius: 18px; } .kpi b { font-size: 22px; }

  /* панели инструментов */
  .toolbar { gap: 10px; margin-bottom: 10px; }
  .toolbar__title { order: 1; flex: 1 1 100%; min-width: 0; font-size: 22px; }
  .toolbar__nav { order: 2; } .toolbar > .seg { order: 3; }
  #ovPeriod, #ovGran, #fPeriod { width: 100%; }
  .seg button { flex: 1 1 0; padding: 11px 6px; min-height: 44px; font-size: 12.5px; }
  #views { flex: 1 1 auto; }
  .toolbar__acts { order: 5; flex: 1 1 100%; display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
  .toolbar__acts::-webkit-scrollbar { display: none; }
  .toolbar__acts .btn { flex: none; }
  #btnCatalog { order: 4; flex: 1 1 100%; }
  .legend { flex-wrap: nowrap; overflow-x: auto; white-space: nowrap; margin-inline: -12px; padding: 0 12px 4px; scrollbar-width: none; }
  .legend::-webkit-scrollbar { display: none; }
  .btn { min-height: 44px; } .btn--sm { min-height: 40px; }
  .ibtn { width: 44px; height: 44px; }
  .link { min-height: 40px; padding: 10px 6px; }

  /* календарь */
  .cal { max-height: none; border-radius: 18px; }
  .wk__head, .wk__body { grid-template-columns: 44px repeat(var(--cols), minmax(0, 1fr)); }
  .wk__times div { padding: 0 5px; font-size: 9.5px; }
  .ev { font-size: 12px; padding: 4px 6px; }
  .mo { min-width: 0; }
  .mo__h { padding: 8px 0; font-size: 9px; letter-spacing: .02em; }
  .mo__c { min-height: 58px; padding: 5px 2px; align-items: center; gap: 2px; }
  .mo .chip, .mo .more { display: none; }
  .mo__n { font-size: 15px; }
  .mo__dots { display: flex; gap: 3px; flex-wrap: wrap; justify-content: center; max-width: 100%; }
  .mo__dots i { width: 7px; height: 7px; border-radius: 50%; }

  /* панель приёма и окна: «шторки» снизу */
  .drawer { max-height: 88dvh; padding: 24px 16px calc(24px + env(safe-area-inset-bottom)); overscroll-behavior: contain; }
  .drawer__close { width: 44px; height: 44px; top: 10px; right: 10px; display: grid; place-items: center; font-size: 26px; }
  .status-btns button { min-height: 42px; }
  dialog { width: 100% !important; max-width: 100% !important; margin: auto 0 0 0; max-height: calc(100dvh - 8px); border-radius: 26px 26px 0 0; overscroll-behavior: contain; }
  dialog[open] { animation: sheetIn .38s var(--ease); }
  .dform { padding: 22px 16px calc(24px + env(safe-area-inset-bottom)); }
  .dform__btns { position: sticky; bottom: -1px; background: var(--bg); padding: 12px 0 2px; margin-top: 6px; }
  .dform__btns .btn { flex: 1 1 auto; }
  .cat__row { grid-template-columns: 38px minmax(0, 1fr) 84px 44px; }
  .tagx { padding: 5px 4px 5px 12px; } .tagx button { width: 32px; height: 32px; }

  /* пациенты */
  .plist { border-radius: 20px; }
  .plist__top { flex-wrap: wrap; } .plist__top input { flex: 1 1 100%; min-height: 44px; }
  .plist .only { min-height: 44px; }
  .plist li button { padding: 14px 16px; min-height: 60px; }
  .back { min-height: 44px; padding: 10px 0; display: inline-flex; align-items: center; }
  .pcard { padding: 16px; border-radius: 22px; } .pcard h2 { font-size: 30px; }
  .pcard__head { flex-direction: column; align-items: stretch; }
  .pcard__actions { width: 100%; } .pcard__actions .btn { flex: 1; }
  .photoline, .remline { padding: 12px 14px; gap: 8px 12px; border-radius: 18px; }
  .photoline__ic { width: 36px; height: 36px; border-radius: 12px; } .photoline__ic .ic { width: 18px; height: 18px; }
  .photoline__t { flex: 1 1 0; min-width: 0; }
  .photoline input, .remline .btn, .pl-open { flex: 1 1 100%; }
  .pl-open { justify-content: center; min-height: 44px; }
  .remline .cat__chk { flex: 1 1 100%; min-height: 40px; }
  .sec__head { margin-top: 20px; } .sec__tools { width: 100%; } .sec__tools .btn { flex: 1 1 auto; }
  .stage__head { padding: 10px 12px; } .stage__title { font-size: 17px; }
  .stage__meta { padding: 12px; } .mf { flex: 1 1 100%; } .mf input[type="date"] { width: 100%; }
  .stg-st { align-self: flex-start; }

  /* таблицы плана, работ и операций → карточки */
  .plan__t, .works__t, .ledger__t { min-width: 0 !important; display: block; }
  .plan__t thead, .works__t thead, .ledger__t thead { display: none; }
  .plan__t tbody, .works__t tbody, .ledger__t tbody { display: grid; gap: 10px; padding: 10px; }
  .plan__t tr, .works__t tr, .ledger__t tr { display: grid; gap: 8px 10px; padding: 12px; background: var(--white); border: 1px solid var(--line); border-radius: 16px; }
  .plan__t td, .works__t td, .ledger__t td { padding: 0 !important; width: auto !important; min-width: 0; border: 0 !important; text-align: left !important; background: none !important; }
  .plan__t tr.is-done { background: #f3f8f0; }
  .plan__t input:not([type="checkbox"]), .plan__t select, .works__t input, .works__t select, .ledger__t input, .ledger__t select { min-height: 42px; border-color: var(--line) !important; background: var(--white) !important; }
  .plan__t td.c-tooth::before, .plan__t td.c-desc::before, .plan__t td.c-sum::before,
  .works__t td.w-date::before, .works__t td.w-svc::before, .works__t td.w-tooth::before, .works__t td.w-com::before, .works__t td.w-sum::before, .works__t td.w-src::before,
  .ledger__t td.l-date::before, .ledger__t td.l-cat::before, .ledger__t td.l-amt::before, .ledger__t td.l-com::before { display: block; font: 700 9.5px var(--body); letter-spacing: .1em; text-transform: uppercase; color: var(--ink2); margin-bottom: 3px; }
  .plan__t td.c-tooth::before { content: "Зуб / область"; } .plan__t td.c-desc::before { content: "Описание"; } .plan__t td.c-sum::before { content: "Сумма, ₽"; }
  .works__t td.w-date::before, .ledger__t td.l-date::before { content: "Дата"; } .works__t td.w-svc::before { content: "Процедура"; } .works__t td.w-tooth::before { content: "Зуб"; }
  .works__t td.w-com::before, .ledger__t td.l-com::before { content: "Комментарий"; } .works__t td.w-sum::before, .ledger__t td.l-amt::before { content: "Сумма, ₽"; } .works__t td.w-src::before { content: "Источник"; } .ledger__t td.l-cat::before { content: "Категория"; }
  /* план */
  .plan__t tr { grid-template-columns: 34px minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "chk svc svc" ". tooth sum" ". desc desc" ". act act"; }
  .c-chk { grid-area: chk; align-self: center; } .c-chk input { width: 24px; height: 24px; }
  .c-svc { grid-area: svc; } .c-tooth { grid-area: tooth; } .c-sum { grid-area: sum; } .c-desc { grid-area: desc; }
  .c-act { grid-area: act; justify-self: end; display: flex !important; align-items: center; gap: 10px; }
  .plan__t .num { text-align: left !important; }
  /* работы */
  .works__t tr { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 44px; grid-template-areas: "date date act" "svc svc svc" "tooth com com" "sum src src"; }
  .w-date { grid-area: date; } .w-svc { grid-area: svc; } .w-tooth { grid-area: tooth; } .w-com { grid-area: com; } .w-sum { grid-area: sum; } .w-src { grid-area: src; } .w-act { grid-area: act; justify-self: end; }
  /* операции (доходы / расходы) */
  .ledger { max-height: 72dvh; }
  .ledger__t tr { grid-template-columns: minmax(0, 1fr) 128px 44px; grid-template-areas: "date amt act" "cat cat cat" "com com com"; }
  .l-date { grid-area: date; } .l-amt { grid-area: amt; } .l-cat { grid-area: cat; } .l-com { grid-area: com; } .l-act { grid-area: act; justify-self: end; align-self: end; }
  .ledger__t .num { text-align: left !important; }
  .plan__t .acts .ibtn, .works__t .acts .ibtn, .ledger__t .acts .ibtn { width: 40px; height: 40px; }
  .ledger__t tfoot, .works__t tfoot { display: block; padding: 8px 14px 14px; }
  .ledger__t tfoot tr, .works__t tfoot tr { display: flex; justify-content: space-between; border: 0; padding: 0; background: none; }
  .ledger__t tfoot td, .works__t tfoot td { display: block; position: static !important; } .ledger__t tfoot td:empty, .works__t tfoot td:empty { display: none; }

  /* финансы, графики */
  .panel { padding: 16px; border-radius: 20px; }
  .panel__head h3, .panel > h3 { font-size: 24px; } .panel__total { font-size: 20px; }
  .panel__tools { width: 100%; } .panel__tools select { flex: 1 1 auto; max-width: none; min-height: 44px; }
  .cc { padding: 16px; border-radius: 20px; } .cc h3 { font-size: 22px; }
  .ch__k { min-height: 38px; } .ch__tv summary { min-height: 40px; display: flex; align-items: center; }
  .ht { overflow-x: auto; }
  .ht__g { grid-template-columns: 28px repeat(var(--cols), 30px); width: max-content; }
  .ht__c { aspect-ratio: auto; height: 30px; }
  .dn__svg { width: 170px; }
  .chip2 { padding: 9px 12px; }

  /* зубная формула: целиком, но узкий экран — скроллится по горизонтали, а не делится на половины */
  .teeth { padding: 18px 12px calc(16px + env(safe-area-inset-bottom)); }
  .teeth__sides { display: none; }                          /* переключатель половин больше не используется */
  .teeth__legend { flex-wrap: nowrap; overflow-x: auto; margin-inline: -12px; padding: 0 12px 8px; scrollbar-width: none; }
  .teeth__legend::-webkit-scrollbar { display: none; }
  .lg-i { flex: none; min-height: 42px; }
  .teeth__chart { border-radius: 18px; overflow-x: auto; overflow-y: visible; padding: 4px 2px; -webkit-overflow-scrolling: touch; }
  .teeth__svg { min-width: 640px !important; width: auto; max-width: none; }
  .tp { padding: 12px; } .tp__chips { flex: 1 1 100%; } .chip-mk { min-height: 42px; }
  .teeth__foot { position: sticky; bottom: 0; background: var(--bg); padding: 12px 0 calc(4px + env(safe-area-inset-bottom)); z-index: 3; }
  .teeth__foot .btn { flex: 1 1 auto; }
}

.tp__ct { display: flex; gap: 6px; flex-wrap: wrap; flex: 1 1 100%; }
@media (max-width: 700px) {
  .panel__tools { flex-wrap: wrap; } .panel__tools select { min-width: 0; flex: 1 1 140px; } .panel__tools .btn { flex: none; }
  .pcard__meta a, .kv a { display: inline-block; padding: 10px 0; }
  .gbox summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; }
}

/* телефон: плитки над календарём — одна горизонтальная лента, чтобы календарь был виден сразу */
@media (max-width: 700px) {
  #tiles { display: flex !important; gap: 10px; overflow-x: auto; scroll-snap-type: x proximity; margin: 0 0 12px; padding: 2px 0 6px; scrollbar-width: none; }
  #tiles::-webkit-scrollbar { display: none; }
  #tiles > .tile { flex: 0 0 62%; max-width: 240px; scroll-snap-align: start; padding: 12px 14px; }
  #tiles > .tile:last-child:nth-child(odd) { grid-column: auto; }
  #tiles .tile b { font-size: 22px; }
}

/* =====================================================================
   БОКОВАЯ ПАНЕЛЬ (компьютер, ≥701px): вкладки переехали влево, узкой лентой —
   видны только значки. При наведении раскрывается с подписями (наплывом,
   без сдвига содержимого), во время скролла страницы/таблиц принудительно
   сжимается обратно (класс .force-collapsed, ставит и убирает cabinet.js).
   ===================================================================== */
@media (min-width: 701px) {
  .app { padding-left: 84px; }
  /* плашки и шапка растянуты на всю ширину, включая место под панелью слева — не пустая «дырка» в углу,
     а общая рамка сверху; сам текст остаётся на тех же местах (компенсируем отступ левым паддингом) */
  .demo-banner { margin-left: -84px; padding-left: 100px; }
  .role-note { margin-left: -84px; padding-left: 100px; }
  .top { margin-left: -84px; padding-left: 108px; }
  #tabs {
    position: fixed; left: 0; top: var(--sidebarTop, 123px); bottom: 0; z-index: 40;      /* высоту меряет JS (syncSidebarTop) — плашка переносится по-разному, число тут только запасное */
    width: 84px; margin: 0; padding: 18px 12px; border-radius: 0;
    display: flex; flex-direction: column; align-items: stretch; gap: 6px;
    background: rgba(255, 253, 251, .92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    border-right: 1px solid var(--line); box-shadow: none;
    overflow: hidden; transition: width .2s var(--ease), box-shadow .2s var(--ease);
  }
  #tabs:hover { width: 252px; box-shadow: 10px 0 28px -14px rgba(28, 24, 20, .28); }
  #tabs.force-collapsed, #tabs.force-collapsed:hover { width: 84px !important; box-shadow: none !important; }
  #tabs > button { justify-content: flex-start; gap: 16px; padding: 14px 13px; border-radius: 12px; white-space: nowrap; }
  #tabs > button .ic { flex: none; width: 30px; height: 30px; }             /* значки крупнее */
  #tabs > button span { opacity: 0; transition: opacity .15s; font: 600 13.5px var(--body); }
  #tabs:hover > button span { opacity: 1; }
  #tabs.force-collapsed > button span { opacity: 0 !important; }
  #tabs > button.is-active { box-shadow: none; }

  /* низ панели: перенесённые «+Приём», «Доступ ассистента», «Выйти» — отделены отступом сверху */
  .tabs__spacer { flex: 1 1 auto; }
  #tabs #btnNew, #tabs #btnAccess, #tabs #btnLogout { color: var(--ink2); }
  #tabs .tabs__cta { color: var(--brown); }
  #tabs .tabs__cta .ic { color: var(--brown); }

  /* «Настройки» — в самом низу панели, как служебные кнопки */
  #tabs > button[data-tab="settings"]:not(.is-active) { color: var(--ink2); }
  /* активный раздел — полоска-указатель у левого края панели */
  #tabs > button { position: relative; }
  #tabs > button.is-active::before { content: ""; position: absolute; left: -12px; top: 50%; width: 4px; height: 26px; margin-top: -13px; border-radius: 0 4px 4px 0; background: var(--accent); }

  /* шапка: зубик стоит над узкой панелью (по центру её 84px), название — сразу за ним */
  .top { height: 88px; padding-left: 12px; gap: 20px; }
  .lava-tooth { width: 60px; height: 60px; }
}

/* =====================================================================
   ЗУБИК-«ЛАВА-ЛАМПА» — в шапке рядом с «Кабинет врача»
   ===================================================================== */
.lava-tooth { flex: none; filter: drop-shadow(0 6px 10px rgba(58, 47, 40, .2)); }
.lava-tooth svg { width: 100%; height: 100%; overflow: visible; display: block; }
.lava-bg { fill: #e2e5e9; }
.lava-edge { fill: none; stroke: #8d9097; stroke-width: .55; stroke-linejoin: round; }
.lava-b { fill: #b3b6bc; transform-box: fill-box; transform-origin: center; }
/* позиции — атрибутами cx/cy в разметке; движение — transform (CSS-анимацию cx/cy/r Safari на iPhone не поддерживает, зубик там стоял) */
.lava-b1 { fill: #d7d9dd; animation: lavaFloat1 7s ease-in-out infinite; }
.lava-b2 { fill: #9a9da3; animation: lavaFloat2 8.5s ease-in-out infinite; }
.lava-b3 { fill: #6f7278; animation: lavaFloat3 6.2s ease-in-out infinite; }
@keyframes lavaFloat1 { 0%, 100% { transform: translate(0, 0) scale(1); } 33% { transform: translate(5px, -6px) scale(.83); } 66% { transform: translate(1px, -7px) scale(1.14); } }
@keyframes lavaFloat2 { 0%, 100% { transform: translate(0, 0) scale(1); } 40% { transform: translate(-6px, 8px) scale(1.23); } 75% { transform: translate(-1px, 9px) scale(.8); } }
@keyframes lavaFloat3 { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(-1px, -10px) scale(1.32); } }@media (prefers-reduced-motion: reduce) { .lava-b1, .lava-b2, .lava-b3 { animation: none; } }

/* =====================================================================
   ЖИВОСТЬ: фон с мягкими пятнами фирменных цветов, приветствие в шапке,
   проявление карточек при открытии вкладки, отклик на наведение
   ===================================================================== */
body::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(700px 480px at 92% -6%, rgba(65, 125, 151, .13), transparent 70%),
    radial-gradient(620px 420px at 18% 108%, rgba(207, 102, 48, .08), transparent 70%),
    radial-gradient(520px 380px at 60% 55%, rgba(81, 68, 59, .045), transparent 70%);
}
.top__brand em { background: linear-gradient(95deg, var(--dark) 20%, var(--brown) 55%, var(--accent)); -webkit-background-clip: text; background-clip: text; color: transparent; }

.top__info { margin-left: auto; display: flex; align-items: center; gap: 12px; min-width: 0; }
.ti__hello { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; margin-right: 6px; white-space: nowrap; }
.ti__hello b { font: 600 20px/1 var(--head); color: var(--dark); }
.ti__hello span { font: 600 11px/1 var(--body); color: var(--ink2); letter-spacing: .04em; }
.ti__hello span::first-letter { text-transform: uppercase; }
.ti__pill { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; background: var(--bg-tint); font: 600 12.5px var(--body); color: var(--ink2); white-space: nowrap; }
.ti__pill i { width: 8px; height: 8px; border-radius: 50%; background: #2e8540; box-shadow: 0 0 0 0 rgba(46, 133, 64, .5); animation: tiPulse 2.4s ease-out infinite; }
@keyframes tiPulse { 0% { box-shadow: 0 0 0 0 rgba(46, 133, 64, .45); } 70%, 100% { box-shadow: 0 0 0 8px rgba(46, 133, 64, 0); } }
.ti__next { display: grid; grid-template-columns: auto auto; grid-template-rows: auto auto; column-gap: 10px; align-items: center; text-align: left; padding: 8px 16px 8px 14px; border-radius: 16px; border: 0; cursor: pointer;
  background: linear-gradient(135deg, #3d7a95, #2d5d78); color: #fff; box-shadow: 0 10px 22px -12px rgba(45, 93, 120, .9); transition: transform .25s var(--ease), box-shadow .25s; }
.ti__next:hover { transform: translateY(-1px); box-shadow: 0 14px 26px -12px rgba(45, 93, 120, .95); }
.ti__next small { grid-column: 1 / -1; font: 700 9.5px/1.2 var(--body); letter-spacing: .12em; text-transform: uppercase; opacity: .75; }
.ti__next b { font: 600 18px/1.1 var(--head); }
.ti__next span { font: 600 12.5px var(--body); opacity: .9; white-space: nowrap; }
@media (max-width: 1180px) { .ti__hello { display: none; } }
@media (max-width: 900px) { .ti__pill { display: none; } }

/* карточки: мягкий «воздух» и отклик на наведение (без transform — внутри графики с подсказками) */
.cc:not(.brand):not(.brand--brown), .panel, .tile:not(.brand) { background: linear-gradient(180deg, #fffefc, #fdf9f5); }
.cc, .panel, .tile, .kpi { transition: box-shadow .3s var(--ease), border-color .3s var(--ease); }
.cc:not(.brand):not(.brand--brown):hover, .panel:hover, .tile:hover { box-shadow: 0 1px 2px rgba(58, 47, 40, .04), 0 18px 38px -22px rgba(58, 47, 40, .35); border-color: #dccfc2; }
.cc h3::after, .panel > h3::after, .panel__head h3::after { content: ""; display: block; width: 28px; height: 3px; border-radius: 3px; margin-top: 8px; background: linear-gradient(90deg, var(--accent), rgba(65, 125, 151, .25)); }
.cc.brand h3::after, .cc.brand--brown h3::after { background: rgba(255, 255, 255, .55); }

/* проявление карточек при открытии вкладки (класс .enter ставит cabinet.js на ~1 с) */
@keyframes riseIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.page.enter .kpis > *, .page.enter .tiles > *, .page.enter .cc, .page.enter .panel, .page.enter .cal, .page.enter .plist, .page.enter .pcard { animation: riseIn .55s var(--ease) both; }
.page.enter .kpis > :nth-child(2), .page.enter .tiles > :nth-child(2), .page.enter .cc:nth-child(2) { animation-delay: .05s; }
.page.enter .kpis > :nth-child(3), .page.enter .tiles > :nth-child(3), .page.enter .cc:nth-child(3) { animation-delay: .1s; }
.page.enter .tiles > :nth-child(4), .page.enter .cc:nth-child(4) { animation-delay: .15s; }
.page.enter .tiles > :nth-child(n+5), .page.enter .cc:nth-child(n+5) { animation-delay: .2s; }
@media (prefers-reduced-motion: reduce) { .page.enter * { animation: none !important; } .ti__pill i { animation: none; } }

/* телефон: зубик поменьше слева от названия, приветствие прячем — места нет */
@media (max-width: 700px) {
  .top { justify-content: flex-start; gap: 10px; }
  .lava-tooth { display: block !important; width: 38px; height: 38px; }
  .top__info { display: none; }
  #tabs #btnLogout span { display: none !important; }       /* подпись «Выйти» не должна вылезать из круглой кнопки */
  #tabs #btnLogout { width: 40px; height: 40px; min-height: 40px; padding: 0; }   /* общие правила нижней панели растягивали её в «таблетку» 22×56 */
}

/* =====================================================================
   ОПЛАТА ПРИЁМОВ И ДОЛГИ
   ===================================================================== */
.pst { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; padding: 2px 9px; border-radius: 999px; font: 700 10.5px/1.5 var(--body); letter-spacing: .02em; text-transform: none; white-space: nowrap; vertical-align: middle; }
.pst--paid { background: #dcebd9; color: #245a2c; }
.pst--paid::before { content: "✓"; }
.pst--partial { background: #fbe9c6; color: #7a5300; }
.pst--partial::before { content: "◐"; }
.pst--unpaid { background: #f6d9d4; color: #9a2f22; }
.pst--unpaid::before { content: "!"; font-weight: 800; }
.pay__res .pst, .paybox__top .pst { margin-left: 0; }

/* значок ₽ на приёме в календаре: оплачен не полностью */
.paymk { position: absolute; right: 4px; bottom: 3px; width: 16px; height: 16px; border-radius: 50%; display: grid; place-items: center; font: 800 10px/1 var(--body); font-style: normal; color: #fff; box-shadow: 0 0 0 2px var(--white); }
.paymk--partial { background: #c98a00; } .paymk--unpaid { background: #c23b3b; }
.chip { position: relative; } .chip .paymk { position: static; display: inline-grid; width: 14px; height: 14px; margin-left: 4px; font-size: 9px; box-shadow: none; vertical-align: -2px; }

/* блок «Оплата» в панели приёма */
.paybox { background: var(--white); border: 1px solid var(--line); border-radius: 18px; padding: 14px 16px; margin: 6px 0 18px; display: grid; gap: 10px; }
.paybox__top { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; }
.paybox__top b { font: 600 14px var(--body); }
.paybox__top em { font-style: normal; font: 700 13px var(--body); color: #9a2f22; margin-left: auto; }
.paybox__hint { font-size: 12.5px; color: var(--ink2); margin: 0; }
.paylist { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.paylist li { display: flex; align-items: center; gap: 10px; padding: 6px 4px 6px 10px; border-radius: 10px; background: var(--bg); font-size: 13px; }
.paylist li b { margin-left: auto; font-weight: 700; }
.paylist .ibtn { width: 26px; height: 26px; font-size: 14px; }
.paybox__acts { display: flex; flex-wrap: wrap; gap: 8px; }

/* задолженность в карточке пациента */
.debt { display: flex; align-items: center; justify-content: space-between; gap: 12px 16px; flex-wrap: wrap; margin: 4px 0 16px; padding: 14px 16px 14px 18px; border-radius: 18px;
  background: linear-gradient(135deg, #fbe4df, #f8ece4); border: 1px solid #efc6bd; box-shadow: inset 4px 0 0 #c23b3b; }
.debt b { display: block; font: 600 22px/1.15 var(--head); color: #8f2a1f; }
.debt small { display: block; font-size: 12.5px; color: #7b4a42; margin-top: 3px; }

/* бейдж «долг» в списке пациентов */
.nm__r { display: inline-flex; align-items: center; gap: 6px; flex: none; }
.debtb { font-style: normal; font: 700 10.5px/1.6 var(--body); padding: 0 8px; border-radius: 999px; background: #f6d9d4; color: #9a2f22; white-space: nowrap; }

/* панель «Долги пациентов» в «Фин. модели» */
.panel.debts { margin: 16px 0 20px; }
.debts__l { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 8px; }
.debts__l li { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 14px; padding: 12px 14px 12px 16px; border-radius: 16px; background: var(--bg); border: 1px solid var(--line); box-shadow: inset 3px 0 0 #c23b3b; }
.debts__p { text-align: left; background: none; border: 0; padding: 0; cursor: pointer; min-width: 0; }
.debts__p b { display: block; font: 600 15px var(--body); }
.debts__p:hover b { color: var(--accent); }
.debts__p small { display: block; font-size: 12px; color: var(--ink2); margin-top: 2px; line-height: 1.5; }
.debts__s { font: 600 22px var(--head); color: #9a2f22; white-space: nowrap; }
.debts__ok { margin: 6px 0 0; padding: 12px 16px; border-radius: 14px; background: #e6f1e3; color: #245a2c; font-weight: 600; font-size: 13px; }
@media (max-width: 700px) { .debts__l li { grid-template-columns: 1fr auto; } .debts__l li .btn { grid-column: 1 / -1; } }

/* окно оплаты */
#payDlg { width: min(520px, calc(100% - 24px)); }
.pay__who { margin: -4px 0 14px; font-size: 13px; color: var(--ink2); }
.pay__sum { margin: 0 0 10px; font-size: 13px; color: var(--ink2); }
.pay__sum:empty { display: none; }
.pay__quick { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 12px; }
.pay__q { border: 1px solid var(--line-strong); background: var(--white); border-radius: 999px; padding: 8px 14px; font: 600 12.5px var(--body); color: var(--ink2); cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.pay__q:hover { background: var(--brown); border-color: var(--brown); color: #f6f1ec; }
.pay__res { min-height: 44px; padding: 12px 14px; border-radius: 14px; background: var(--bg-tint); font-size: 13px; line-height: 1.6; }
.pay__res:empty { display: none; }

/* поле пароля на входе: «Показать / Скрыть» и подсказка о Caps Lock (assets/gate.js) */
.pw { position: relative; display: grid; }
.pw input { width: 100%; padding-right: 100px !important; }
.pw__eye { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); border: 0; border-radius: 999px; padding: 8px 12px; background: #efe7df; color: #5d544c; font: 600 12px var(--body); cursor: pointer; transition: background .2s, color .2s; }
.pw__eye:hover, .pw__eye:focus-visible { background: #51443b; color: #f6f1ec; }
.pw__caps { margin: -6px 0 0; padding: 8px 12px; border-radius: 12px; background: #fff2c2; color: #7a5d00; font-size: 12.5px; text-align: left; }

/* =====================================================================
   ЗАЯВКИ С САЙТА
   ===================================================================== */
.tabs > button { position: relative; }
.tabs__badge { position: absolute; top: 6px; left: 34px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: #c23b3b; color: #fff; font: 800 10.5px/18px var(--body); font-style: normal; text-align: center; box-shadow: 0 0 0 2px var(--white); }
@media (max-width: 700px) { .tabs__badge { top: 4px; left: calc(50% + 4px); } }
.ti__bk { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; border: 0; cursor: pointer; background: #fbe4df; color: #8f2a1f; font: 700 12.5px var(--body); white-space: nowrap; transition: background .2s; }
.ti__bk:hover { background: #f6d2ca; }
.ti__bk i { width: 8px; height: 8px; border-radius: 50%; background: #c23b3b; animation: tiPulseR 2s ease-out infinite; }
@keyframes tiPulseR { 0% { box-shadow: 0 0 0 0 rgba(194, 59, 59, .5); } 70%, 100% { box-shadow: 0 0 0 8px rgba(194, 59, 59, 0); } }
@media (prefers-reduced-motion: reduce) { .ti__bk i { animation: none; } }

.bk__sub { margin: -6px 0 16px; max-width: 760px; }
.bk { display: grid; gap: 12px; }
.bk__i { background: var(--white); border: 1px solid var(--line); border-radius: 22px; padding: 18px 20px; display: grid; gap: 10px; box-shadow: inset 4px 0 0 var(--line-strong); transition: box-shadow .3s var(--ease); }
.bk__i--new { box-shadow: inset 4px 0 0 #c23b3b, 0 14px 30px -24px rgba(58, 47, 40, .5); }
.bk__i--done { box-shadow: inset 4px 0 0 #2e8540; }
.bk__i--declined { opacity: .72; }
.bk__head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.bk__name { font: 600 22px/1.15 var(--head); }
.bk__head time { margin-left: auto; font-size: 12px; color: var(--ink2); }
.bk__st { padding: 2px 10px; border-radius: 999px; font: 700 10.5px/1.6 var(--body); background: var(--bg-tint); color: var(--ink2); }
.bk__st--new { background: #fbe4df; color: #8f2a1f; } .bk__st--done { background: #dcebd9; color: #245a2c; }
.bk__meta { display: flex; align-items: center; gap: 8px 14px; flex-wrap: wrap; font-size: 13.5px; }
.bk__phone { display: inline-flex; align-items: center; gap: 7px; padding: 7px 14px 7px 11px; border-radius: 999px; background: linear-gradient(135deg, #3d7a95, #2d5d78); color: #fff; font-weight: 700; text-decoration: none; box-shadow: 0 8px 18px -12px rgba(45, 93, 120, .9); }
.bk__phone .ic { width: 16px; height: 16px; }
.bk__topic { padding: 6px 12px; border-radius: 999px; background: var(--bg-tint); color: var(--ink2); font-weight: 600; }
.bk__known { border: 0; background: none; padding: 0; color: var(--accent); font: 600 12.5px var(--body); text-decoration: underline; cursor: pointer; }
.bk__note { width: 100%; border: 1px solid var(--line); border-radius: 12px; padding: 9px 12px; font: 400 13px var(--body); background: var(--bg); }
.bk__note:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(65, 125, 151, .15); }
.bk__acts { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bk__del { color: #9a2f22; border-color: #e6c3bc; }
.bk__by { margin-left: auto; font-size: 11.5px; color: var(--ink2); }
.bk__empty { padding: 28px; border-radius: 22px; background: var(--white); border: 1px dashed var(--line-strong); text-align: center; color: var(--ink2); font-weight: 600; }
@media (max-width: 700px) { .bk__i { padding: 16px; border-radius: 18px; } .bk__acts .btn { flex: 1 1 auto; } .bk__head time { margin-left: 0; width: 100%; } }

/* =====================================================================
   ЗАКУПКИ МАТЕРИАЛОВ
   ===================================================================== */
.tabs__badge--soft { background: #4f7a5a; }
.ti__sup { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; border: 0; cursor: pointer; background: #fbeccb; color: #7a5300; font: 700 12.5px var(--body); white-space: nowrap; }
.ti__sup:hover { background: #f7e0ad; }
#supView b { font-weight: 800; margin-left: 4px; }
#supView b:empty { display: none; }
.sup__add { background: var(--white); border: 1px solid var(--line); border-radius: 22px; padding: 18px 20px; margin-bottom: 18px; display: grid; gap: 10px; box-shadow: 0 14px 30px -26px rgba(58, 47, 40, .5); }
.sup__row { display: grid; grid-template-columns: minmax(0, 1fr) 110px 150px auto; gap: 12px; align-items: end; }
.sup__more { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr); }
.sup__add label { display: grid; gap: 6px; font: 700 10.5px/1.3 var(--body); letter-spacing: .08em; text-transform: uppercase; color: var(--ink2); }
.sup__add input, .sup__add select { width: 100%; font: 500 15px var(--body); letter-spacing: 0; text-transform: none; color: var(--dark); padding: 12px 14px; border: 1px solid var(--line-strong); border-radius: 12px; background: var(--bg); outline: none; }
.sup__add input:focus, .sup__add select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(65, 125, 151, .15); }
.sup__add .btn { height: 46px; }
.sup__more-t { justify-self: start; font-size: 12.5px; }
.sup__hint { margin: 0; font-size: 12.5px; color: #245a2c; background: #e6f1e3; border-radius: 10px; padding: 8px 12px; }
.sup__list { background: var(--white); border: 1px solid var(--line); border-radius: 22px; overflow: hidden; }
.sup__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 18px; background: var(--bg-tint); font-size: 13px; color: var(--ink2); }
.sup__chk { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.sup__chk input { width: 18px; height: 18px; accent-color: var(--brown); }
.sup__it { display: grid; grid-template-columns: 30px minmax(0, 1fr) 96px 110px 96px 34px; gap: 10px; align-items: center; padding: 10px 18px; border-top: 1px solid var(--line); transition: background .2s; }
.sup__it.is-sel { background: #f3f7ef; }
.sup__main small { display: block; font-size: 11.5px; color: var(--ink2); margin: 2px 0 0 10px; }
.sup__main a { color: var(--accent); }
.sup__in { width: 100%; font: 500 14px var(--body); color: var(--dark); padding: 8px 10px; border: 1px solid transparent; border-radius: 10px; background: transparent; outline: none; }
.sup__in:hover { border-color: var(--line); }
.sup__in:focus { border-color: var(--accent); background: var(--white); }
.sup__in--name { font-weight: 600; font-size: 15px; }
.sup__num { display: grid; gap: 2px; }
.sup__num span { font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink2); padding-left: 10px; }
.sup__sum { text-align: right; font-size: 14px; white-space: nowrap; }
.sup__bar { position: sticky; bottom: 12px; z-index: 5; margin-top: 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 14px 12px 20px; border-radius: 18px; background: var(--brown); color: #f6f1ec; box-shadow: 0 18px 34px -18px rgba(58, 47, 40, .75); font-size: 14px; }
.sup__bar em { font-style: normal; color: #f1d9a5; }
.sup__bar .btn { background: #f6f1ec; color: var(--brown); box-shadow: none; }
.sup__bar .btn:disabled { opacity: .5; }
.sup__empty { padding: 28px; border-radius: 22px; background: var(--white); border: 1px dashed var(--line-strong); text-align: center; color: var(--ink2); font-weight: 600; }
.ord { display: grid; gap: 12px; }
.ord__i { background: var(--white); border: 1px solid var(--line); border-radius: 22px; padding: 18px 20px; display: grid; gap: 8px; box-shadow: inset 4px 0 0 #7fa383; }
.ord__i.is-today { box-shadow: inset 4px 0 0 #c98a00; }
.ord__i.is-late { box-shadow: inset 4px 0 0 #c23b3b; }
.ord__top { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.ord__shop { font: 600 22px/1.15 var(--head); }
.ord__st { padding: 2px 10px; border-radius: 999px; font: 700 11px/1.6 var(--body); background: #e3eee0; color: #245a2c; }
.ord__st--today { background: #fbecc9; color: #7a5300; } .ord__st--late { background: #f6d9d4; color: #9a2f22; } .ord__st--got { background: var(--bg-tint); color: var(--ink2); }
.ord__total { margin-left: auto; font: 600 22px var(--head); }
.ord__meta { margin: 0; font-size: 12.5px; color: var(--ink2); }
.ord__meta a, .ord__items a { color: var(--accent); }
.ord__items { list-style: none; margin: 4px 0; padding: 0; border-top: 1px solid var(--line); }
.ord__items li { display: grid; grid-template-columns: minmax(0, 1fr) auto 90px; gap: 12px; padding: 7px 0; border-bottom: 1px dashed var(--line); font-size: 13.5px; }
.ord__items b { text-align: right; }
.ord__q { color: var(--ink2); white-space: nowrap; }
.ord__acts { display: flex; gap: 8px; flex-wrap: wrap; }
.ord__sum { display: grid; gap: 2px; padding: 14px 16px; border-radius: 14px; background: var(--bg-tint); margin-bottom: 6px; }
.ord__sum b { font: 600 30px/1.1 var(--head); }
.ord__sum span { font-size: 13px; color: var(--ink2); }
.ord__sum em { font-style: normal; font-size: 12.5px; color: #7a5300; margin-top: 4px; }
@media (max-width: 900px) {
  .sup__row { grid-template-columns: 1fr 1fr; }
  .sup__row .sup__name, .sup__row .sup__url { grid-column: 1 / -1; }
  .sup__row .btn { grid-column: 1 / -1; }
  .sup__more { grid-template-columns: 1fr 1fr; }
  .sup__it { grid-template-columns: 28px minmax(0, 1fr) 34px; grid-template-areas: "c m x" ". q p" ". s s"; row-gap: 4px; padding: 12px 14px; }
  .sup__it > .sup__chk { grid-area: c; } .sup__main { grid-area: m; } .sup__it > .ibtn { grid-area: x; }
  .sup__it > .sup__num:nth-of-type(2) { grid-area: q; } .sup__it > .sup__num:nth-of-type(3) { grid-area: p; }
  .sup__sum { grid-area: s; text-align: left; padding-left: 10px; color: var(--ink2); }
  .sup__it { grid-template-areas: "c m x" ". q q" ". s s"; }
  .sup__it > .sup__num { display: inline-grid; }
  .ord__items li { grid-template-columns: minmax(0, 1fr) auto; } .ord__items li b { grid-column: 2; }
  .ord__q { grid-column: 1; }
}
@media (max-width: 700px) { .sup__bar { bottom: calc(92px + env(safe-area-inset-bottom)); } }
@media (max-width: 900px) {
  .sup__it { grid-template-columns: 28px minmax(0, 1fr) minmax(0, 1fr) 34px; grid-template-areas: "c m m x" ". q p s"; }
  .sup__sum { grid-area: s; align-self: end; text-align: right; padding: 0 0 10px; color: var(--dark); }
}

/* ---------- сайт: посетители и записи ---------- */
.trf { display: grid; grid-template-columns: 220px minmax(0, 1fr) 240px; gap: 28px; align-items: start; }
.trf__k { display: grid; gap: 12px; }
.trf__k > div { padding: 14px 16px; border-radius: 16px; background: var(--bg-tint); display: grid; gap: 2px; }
.trf__k span { font: 700 10.5px/1.3 var(--body); letter-spacing: .08em; text-transform: uppercase; color: var(--ink2); }
.trf__k b { font: 600 34px/1.05 var(--head); }
.trf__k small { font-size: 11.5px; color: var(--ink2); }
.trf__c h4, .trf__src h4 { margin-bottom: 4px; }
.trf__c h4 + div + h4 { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--line); }
.trf__note { margin-top: 14px; font-size: 12px; color: var(--ink2); }
@media (max-width: 1240px) { .trf { grid-template-columns: 1fr 1fr; } .trf__k { grid-column: 1 / -1; grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px) { .trf { grid-template-columns: 1fr; } .trf__k { grid-template-columns: 1fr; } }

/* =====================================================================
   ВТОРОЙ ВРАЧ (ортодонт): метка в календаре, фильтр, доля в приёме, расчёты
   ===================================================================== */
.ev__doc { display: inline-grid; place-items: center; width: 17px; height: 17px; margin-right: 5px; border-radius: 50%; background: var(--dc, #5d4aa6); color: #fff; font: 800 10px/1 var(--body); font-style: normal; vertical-align: 1px; flex: none; }
/* приём второго врача: пунктирная полоса его цвета слева и лёгкая штриховка — видно с первого взгляда */
.ev.ev--doc { border-left: 4px dashed var(--dc) !important; background-image: repeating-linear-gradient(135deg, transparent 0 7px, color-mix(in srgb, var(--dc) 9%, transparent) 7px 9px); }
.chip .ev__doc { width: 14px; height: 14px; font-size: 8.5px; margin-right: 3px; }
.seg--docs button { display: inline-flex; align-items: center; gap: 7px; }
.seg--docs button i { width: 9px; height: 9px; border-radius: 50%; }
.legend .ev__doc { width: 15px; height: 15px; font-size: 9px; }
.visit__doc { font-style: normal; font-weight: 700; color: var(--ink2); }
.split2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.split2 > div { padding: 10px 12px; border-radius: 12px; background: var(--bg); display: grid; gap: 2px; }
.split2 small { font-size: 11px; color: var(--ink2); }
.split2 b { font: 600 20px var(--head); }
.split2 p { grid-column: 1 / -1; margin: 0; font-size: 11.5px; color: var(--ink2); }
.tag--doc { background: #ece6f6; color: #4b3b78; }
.ledger__auto td { color: var(--ink2); padding-top: 10px; padding-bottom: 10px; }
.cat__row--doc { grid-template-columns: 40px minmax(0, 1fr) minmax(0, 1fr) 84px 34px; }
.cat__pct { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; }
.cat__pct input { width: 60px; }
.panel.docpay { margin: 0 0 20px; }
.dp { border: 1px solid var(--line); border-radius: 18px; padding: 16px 18px; background: var(--white); display: grid; gap: 14px; box-shadow: inset 4px 0 0 var(--dc); }
.dp + .dp { margin-top: 12px; }
.dp__head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.dp__head b { font: 600 20px var(--head); }
.dp__head span { margin-left: auto; font-size: 12.5px; color: var(--ink2); }
.dp__nums { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.dp__nums > div { padding: 10px 12px; border-radius: 12px; background: var(--bg); display: grid; gap: 2px; }
.dp__nums small { font-size: 11px; color: var(--ink2); }
.dp__nums b { font: 600 20px var(--head); }
.dp__left.is-due { background: #f3eefb; box-shadow: inset 0 0 0 1px #d9cdee; }
.dp__left em { font-style: normal; font-size: 11px; color: #7a5300; }
.dp__pay { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; }
.dp__pay label { display: grid; gap: 4px; font: 700 10.5px var(--body); letter-spacing: .06em; text-transform: uppercase; color: var(--ink2); }
.dp__pay input { font: 500 14px var(--body); padding: 9px 12px; border: 1px solid var(--line-strong); border-radius: 10px; background: var(--bg); width: 150px; }
.dp__hist { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.dp__hist li { display: flex; align-items: center; gap: 10px; padding: 6px 4px 6px 10px; border-radius: 10px; background: var(--bg); font-size: 13px; }
.dp__hist b { margin-left: auto; }
.dp__hist .ibtn { width: 26px; height: 26px; font-size: 14px; }
.dp__none { margin: 0; font-size: 12.5px; color: var(--ink2); }
@media (max-width: 1100px) { .dp__nums { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px) { .dp__nums { grid-template-columns: 1fr 1fr; } .dp__left { grid-column: 1 / -1; } .cat__row--doc { grid-template-columns: 34px 1fr 1fr; } .cat__row--doc .cat__pct { grid-column: 2; } }

/* =====================================================================
   ЛИЧНОЕ: зал и кредиты
   ===================================================================== */
.ps-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 18px; }
.ps-tiles--sm { grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 4px; }
.ps-tile { background: var(--white); border: 1px solid var(--line); border-radius: 20px; padding: 16px 18px; display: grid; gap: 4px; align-content: start; }
.ps-tiles--sm .ps-tile { padding: 12px 14px; border-radius: 14px; background: var(--bg); }
.ps-tile small { font: 700 10.5px/1.3 var(--body); letter-spacing: .08em; text-transform: uppercase; color: var(--ink2); }
.ps-tile b { font: 600 30px/1.1 var(--head); }
.ps-tiles--sm .ps-tile b { font-size: 22px; }
.ps-tile span { font-size: 12px; color: var(--ink2); }
.ps-tile--dark { background: linear-gradient(150deg, #51443b, #3a2f28); border-color: transparent; color: #f6f1ec; }
.ps-tile--dark small, .ps-tile--dark span { color: rgba(246, 241, 236, .72); }
.ps-tile--warn { background: #fbf2dc; border-color: #ecd9a6; }
.ps-tile--bad { background: #fbe4df; border-color: #efc6bd; }
.ps-meter { display: block; height: 7px; border-radius: 4px; background: rgba(127, 127, 127, .18); overflow: hidden; margin-top: 4px; }
.ps-meter em { display: block; height: 100%; border-radius: 4px; background: #7fa383; }
.ps-tile--dark .ps-meter { background: rgba(246, 241, 236, .18); } .ps-tile--dark .ps-meter em { background: #b9d4a8; }
.ps-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 18px; align-items: start; margin-bottom: 18px; }
.ps-grid .panel h3 { margin-bottom: 6px; }
.ps-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.ps-cal__head { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.ps-cal__head h3 { margin: 0 4px; min-width: 170px; text-align: center; }
.ps-goal { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink2); }
.ps-goal input { width: 58px; padding: 7px 8px; border: 1px solid var(--line-strong); border-radius: 10px; font: 600 14px var(--body); background: var(--bg); }
.gc { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)) 64px; gap: 6px; }
.gc__h { font: 700 10.5px var(--body); letter-spacing: .06em; text-transform: uppercase; color: var(--ink2); text-align: center; padding-bottom: 2px; }
.gc__d { min-height: 64px; border-radius: 12px; border: 1px solid var(--line); background: var(--white); padding: 6px 7px; text-align: left; display: grid; align-content: start; gap: 3px; cursor: pointer; font: inherit; color: var(--dark); transition: border-color .2s, background .2s; }
.gc__d:hover { border-color: var(--accent); }
.gc__d b { font: 600 15px var(--head); }
.gc__d small { font-size: 10.5px; line-height: 1.25; color: #2d5a35; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.gc__d.is-on { background: #e3efe0; border-color: #a9c9a4; }
.gc__d.is-today { box-shadow: inset 0 0 0 2px var(--brown); }
.gc__d.is-out { border: 0; background: transparent; cursor: default; }
.gc__w { display: grid; place-items: center; border-radius: 12px; background: var(--bg-tint); font: 700 12px var(--body); color: var(--ink2); }
.gc__w.is-ok { background: #dcebd9; color: #245a2c; }
.ps-today { width: 100%; margin-top: 14px; }
.ps-warn { padding: 9px 12px; border-radius: 12px; background: #fbecc9; color: #7a5300; font-size: 12.5px; margin-bottom: 10px; }
.ps-ok { padding: 9px 12px; border-radius: 12px; background: #e3efe0; color: #245a2c; font-size: 12.5px; margin-bottom: 10px; }
.ps-groups { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ps-groups li { display: grid; grid-template-columns: 96px minmax(0, 1fr) 26px 110px; gap: 10px; align-items: center; font-size: 13.5px; }
.ps-bar { display: block; height: 9px; border-radius: 5px; background: var(--bg-tint); overflow: hidden; }
.ps-bar em { display: block; height: 100%; border-radius: 5px; background: #6d9bcf; }
.ps-groups b { text-align: right; }
.ps-rest { font-style: normal; font-size: 11.5px; padding: 2px 8px; border-radius: 999px; background: var(--bg-tint); color: var(--ink2); text-align: center; }
.ps-rest--good { background: #dcebd9; color: #245a2c; } .ps-rest--warn { background: #fbecc9; color: #7a5300; } .ps-rest--bad { background: #f6d9d4; color: #9a2f22; }
.ps-chips { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.ps-chip { display: grid; gap: 2px; padding: 10px 12px; border-radius: 14px; border: 1px solid var(--line-strong); background: var(--white); text-align: left; cursor: pointer; font: inherit; }
.ps-chip b { font-size: 14px; } .ps-chip small { font-size: 11px; color: var(--ink2); }
.ps-chip.is-on { background: var(--brown); border-color: var(--brown); color: #f6f1ec; } .ps-chip.is-on small { color: rgba(246, 241, 236, .75); }
.ps-due { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ps-due li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; align-items: center; padding: 10px 12px; border-radius: 14px; background: var(--bg); box-shadow: inset 3px 0 0 var(--line-strong); }
.ps-due li span { display: grid; gap: 2px; } .ps-due li small { font-size: 11.5px; color: var(--ink2); }
.ps-due li.is-paid { box-shadow: inset 3px 0 0 #7fa383; } .ps-due li.is-paid em { font-style: normal; color: #245a2c; font-weight: 800; }
.ps-due li.is-late { box-shadow: inset 3px 0 0 #c23b3b; background: #fbe9e5; } .ps-due li.is-soon { box-shadow: inset 3px 0 0 #c98a00; }
.ps-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.ps-cr { background: var(--white); border: 1px solid var(--line); border-radius: 20px; padding: 18px; display: grid; gap: 6px; cursor: pointer; text-align: left; font: inherit; color: var(--dark); transition: border-color .2s, box-shadow .2s; }
.ps-cr:hover { border-color: var(--accent); box-shadow: 0 14px 30px -24px rgba(58, 47, 40, .6); }
.ps-cr header { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.ps-cr header b { font: 600 20px var(--head); }
.ps-pill { padding: 2px 9px; border-radius: 999px; background: var(--bg-tint); font-size: 11px; color: var(--ink2); }
.ps-cr strong { font: 600 30px/1.1 var(--head); }
.ps-cr > small { font-size: 12px; color: var(--ink2); }
.ps-cr dl { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; margin: 6px 0; font-size: 13px; }
.ps-cr dt { color: var(--ink2); } .ps-cr dd { margin: 0; text-align: right; font-weight: 600; }
.ps-cr .btn { justify-self: stretch; }
.ps-cr--add { place-items: center; align-content: center; text-align: center; border-style: dashed; background: transparent; min-height: 200px; }
.ps-cr--add span { font: 300 40px/1 var(--body); color: var(--ink2); }
.ps-cr--add small { font-size: 12px; color: var(--ink2); }
.psdlg { width: min(860px, calc(100% - 24px)); }
.crdlg__grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 14px; }
.crdlg__grid h4 { margin: 4px 0 8px; font: 700 10.5px var(--body); letter-spacing: .08em; text-transform: uppercase; color: var(--ink2); }
.crdlg__tbl { max-height: 260px; overflow: auto; border: 1px solid var(--line); border-radius: 12px; }
.crdlg__tbl .tbl { width: 100%; font-size: 12.5px; }
@media (max-width: 1100px) { .ps-tiles { grid-template-columns: 1fr 1fr; } .ps-grid { grid-template-columns: 1fr; } .ps-cards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 700px) {
  .ps-cards, .crdlg__grid, .ps-tiles--sm { grid-template-columns: 1fr; }
  .ps-chips { grid-template-columns: 1fr 1fr; }
  .gc { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; } .gc__h:nth-child(8), .gc__w { display: none; }
  .gc__d { min-height: 46px; padding: 4px; border-radius: 9px; } .gc__d small { display: none; } .gc__d.is-on b::after { content: " ✓"; color: #2d5a35; font-size: 11px; }
  .ps-groups li { grid-template-columns: 80px minmax(0, 1fr) 22px; } .ps-rest { grid-column: 1 / -1; justify-self: start; }
  .ps-goal { margin-left: 0; }
}

/* ---------- Зал: анатомическая карта, радар, 12 недель, подсказки ---------- */
#tab-personal, #psDlg { --ps-body: #e3ddd4; --ps-body-edge: #fbf8f4; }
svg.psbody { display: block; width: 100%; height: auto; overflow: visible; }
svg.psbody .bl { font: 600 8.5px var(--body); fill: var(--ink2); stroke: none; letter-spacing: .06em; text-transform: uppercase; }
svg.psbody.mini { width: auto; height: 30px; margin: 1px auto 0; }
.gc__d.is-on { --ps-body: rgba(255, 255, 255, .7); --ps-body-edge: #e3efe0; }
.muscle.on { filter: drop-shadow(0 0 2.5px rgba(65, 125, 151, .55)); }
svg.mini .muscle.on { filter: none; }
.muscle.hit, .heart.hit { cursor: pointer; transition: fill .2s, filter .2s; }
.muscle.hit:not(.on):hover { fill: #b9d4c0; }
.heart.on { filter: drop-shadow(0 0 3px rgba(217, 83, 111, .7)); }
svg.mini .heart.on { filter: none; }
.gbody { max-width: 300px; width: 100%; margin: 4px auto 8px; }
.gmini { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--bg-tint); flex: none; }
.gmini svg.psbody.mini { height: 32px; margin: 0; }
.gmini b { color: var(--accent); }
.gstat { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 12px; align-items: center; margin-top: 8px; }
.gstat svg.psbody { max-width: 250px; margin: 0 auto; }
.heatleg { display: flex; align-items: center; gap: 8px; justify-content: center; font-size: 11.5px; color: var(--ink2); margin-top: 6px; }
.heatleg i { width: 90px; height: 8px; border-radius: 999px; background: linear-gradient(90deg, rgba(65, 125, 151, .28), #a8754a); }
svg.psradar { display: block; width: 100%; max-width: 380px; margin: 0 auto; overflow: visible; }
svg.psradar text { font: 600 13px var(--body); fill: var(--ink2); }
.ps-pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 8px; }
.ps-pill.is-on { background: #e1ecf1; color: #2d5d78; }
.ps-dark { background: linear-gradient(155deg, #3d4b37, #2c3628); border-color: transparent; color: #f4f1ea; }
.ps-dark h3 { color: #f4f1ea; } .ps-dark .panel__sub { color: rgba(244, 241, 234, .7); }
svg.psweeks { display: block; width: 100%; height: auto; }
svg.psweeks text { font: 600 11px var(--body); fill: rgba(244, 241, 234, .7); }
svg.psweeks text.v { fill: #f4f1ea; }
.ps-last { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.ps-last li { display: flex; align-items: center; gap: 10px; padding: 5px 0; border-bottom: 1px dashed var(--line); font-size: 14px; }
.ps-last li span { flex: 1; }
.pstip { position: fixed; left: 0; top: 0; z-index: 400; pointer-events: none; background: #2c3628; color: #f4f1ea; font-size: 12.5px; line-height: 1.5; padding: 9px 12px; border-radius: 12px; max-width: 280px; opacity: 0; transition: opacity .08s; box-shadow: 0 10px 24px rgba(20, 24, 18, .35); }
.pstip.show { opacity: 1; }
@media (max-width: 700px) { .gstat { grid-template-columns: 1fr; } .gc__d svg.psbody.mini { height: 22px; } .gc__d.is-on b::after { content: none; } }
@media (hover: none) { .pstip { display: none; } }
.ps-last li span { flex: initial; }
.ps-last li > span:not(.gmini) { flex: 1; }
.ps-row h3, .ps-grid .panel > h3, .ps-grid .panel .ps-row h3 { font-size: clamp(24px, 2.4vw, 30px); }

/* Google: список календарей и события «на весь день» */
.gcals { display: grid; gap: 4px; margin: 4px 0 6px; }
.gcals .cat__chk { display: flex; align-items: center; gap: 8px; }
.gcals__dot { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.ev--gday { border-style: dashed; }
.ev--gday span { display: none; }

/* =====================================================================
   СТИЛЬ APPLE (как у «Дилайт Сизон») — финальный слой поверх всего.
   Системный шрифт SF, стеклянные панели с размытием, сегменты и вкладки-капсулы,
   стеклянное меню и окна. Цвета кабинета прежние: кофейный, бирюзовый, персиковый.
   ===================================================================== */
:root {
  --body: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI Variable Text", "Segoe UI", Inter, Manrope, Roboto, "Helvetica Neue", Arial, sans-serif;
  --head: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI Variable Display", "Segoe UI", Inter, Manrope, Roboto, "Helvetica Neue", Arial, sans-serif;
  --bg: #f3eee9; --ink2: #6e655d;
  --glass: rgba(255, 253, 251, .6); --glass-strong: rgba(255, 253, 251, .84); --glass-soft: rgba(255, 255, 255, .42);
  --glass-hi: inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 0 0 1px rgba(255, 255, 255, .55);
  --glass-shadow: 0 1px 2px rgba(58, 47, 40, .05), 0 12px 36px -14px rgba(58, 47, 40, .22);
  --glass-shadow-lg: 0 2px 6px rgba(58, 47, 40, .08), 0 30px 80px -20px rgba(58, 47, 40, .38);
  --glass-blur: blur(24px) saturate(170%);
  --seg-track: rgba(118, 104, 92, .12); --seg-on: #ffffff;
  --shadow: var(--glass-shadow); --shadow-lg: var(--glass-shadow-lg);
}
html body { font-family: var(--body); letter-spacing: -.006em; background: var(--bg); }
/* фон: мягкие пятна фирменных цветов — под стеклом они дают глубину */
body::before {
  background:
    radial-gradient(42% 38% at 4% 2%, rgba(214, 160, 110, .30), transparent 72%),
    radial-gradient(40% 36% at 98% 4%, rgba(65, 125, 151, .30), transparent 72%),
    radial-gradient(46% 42% at 90% 98%, rgba(81, 68, 59, .16), transparent 72%),
    radial-gradient(40% 40% at 8% 94%, rgba(120, 170, 160, .22), transparent 72%) !important;
}

/* заголовки — SF Display, плотные */
h1, h2, h3, h4, .toolbar__title, .top__brand, .tile b, .kpi b, .hs__r b, .gg__c b, .sp__head b, .wk__day b, .mo__n, .ti__hello b, .ti__next b,
.pcard h2, .drawer h3, .dform h3, .cat__h, .pcard h4, .stage__title, .panel > h3, .panel__head h3, .cc h3, .gate__box h1, .ps-tile b, .ps-cr strong {
  font-family: var(--head) !important; font-weight: 700 !important; letter-spacing: -.022em !important; text-transform: none !important;
}
.toolbar__title { font-size: 30px !important; }
.panel > h3, .panel__head h3, .cc h3 { font-size: 21px !important; }
.cc h3::after, .panel > h3::after, .panel__head h3::after { display: none !important; }
.tile b, .ps-tile b { font-size: 28px !important; } .kpi b { font-size: 26px !important; } .hs__r b { font-size: 28px !important; }
.gg__c b { font-size: clamp(20px, 2vw, 28px) !important; } .sp__head b { font-size: 24px !important; }
.pcard h2 { font-size: 34px !important; } .drawer h3 { font-size: 28px !important; } .dform h3 { font-size: 26px !important; }
.cat__h, .pcard h4 { font-size: 20px !important; } .stage__title { font-size: 18px !important; }
.top__brand { font-size: 22px !important; } .ti__hello b { font-size: 17px !important; } .gate__box h1 { font-size: 34px !important; }
.wk__day b { font-size: 21px !important; } .mo__n { font-size: 15px !important; }
/* подписи — без капса и разрядки, как в iOS */
.eyebrow, .kpi span, .tile span, .hs__r span, .hg header h3, .kv dt, .field-label, .dform label, .wk__day small, .mo__h, .ps-tile small,
.tbl th, .ti__next small, .top__brand span, .gg__list li span, .badge {
  text-transform: none !important; letter-spacing: 0 !important;
}
.kpi span, .tile span, .hs__r span, .ps-tile small, .kv dt, .field-label, .dform label, .tbl th { font: 500 12.5px/1.35 var(--body) !important; }
.hg header h3 { font: 600 15px/1.2 var(--body) !important; }
.wk__day small, .mo__h { font: 500 11.5px var(--body) !important; }
.top__brand span { font: 500 11px var(--body) !important; color: var(--ink2) !important; }

/* панели и карточки — стекло */
.tile:not(.brand), .kpi, .panel:not(.brand):not(.brand--brown), .cc:not(.brand):not(.brand--brown), .cta-line, .cal, .plist, .pcard, .ps-tile:not(.ps-tile--dark), .ps-cr {
  background: var(--glass) !important; border: 0 !important;
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  box-shadow: var(--glass-hi), var(--glass-shadow) !important; border-radius: 22px;
}
.tile:not(.brand):hover, .panel:not(.brand):not(.brand--brown):hover, .cc:not(.brand):not(.brand--brown):hover { box-shadow: var(--glass-hi), 0 2px 4px rgba(58, 47, 40, .05), 0 18px 44px -16px rgba(58, 47, 40, .3) !important; }
.panel .panel, .cc .panel, .pcard .stage, .pcard .visit, .pstats, .ledger, .fill, .ro, .gbox { background: var(--glass-soft) !important; border-color: rgba(255, 255, 255, .6) !important; box-shadow: var(--glass-hi) !important; }
.stage, .visit, .ledger { border: 0 !important; }
/* цветные панели (бирюзовая, кофейная) — тонированное стекло с бликом */
.brand, .brand--brown, .ps-tile--dark {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .32), inset 0 0 0 1px rgba(255, 255, 255, .1), 0 18px 44px -20px rgba(33, 60, 80, .6) !important;
  border-radius: 24px !important;
}
.brand::before, .brand--brown::before { background: radial-gradient(circle, rgba(255, 255, 255, .26), transparent 66%) !important; }
.gg__track { stroke: rgba(255, 255, 255, .2); }
.gg__arc { filter: drop-shadow(0 0 8px rgba(255, 255, 255, .35)) drop-shadow(0 4px 10px rgba(0, 0, 0, .15)); }

/* шапка и меню — стекло */
.top { background: rgba(255, 253, 251, .62) !important; -webkit-backdrop-filter: blur(30px) saturate(190%); backdrop-filter: blur(30px) saturate(190%); border-bottom: 0 !important; box-shadow: inset 0 -1px 0 rgba(58, 47, 40, .07); }
.ti__pill { background: var(--seg-track) !important; }
.ti__next { border-radius: 18px !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 10px 24px -12px rgba(45, 93, 120, .9) !important; }
@media (min-width: 701px) {
  #tabs { background: rgba(255, 253, 251, .55) !important; -webkit-backdrop-filter: blur(30px) saturate(190%); backdrop-filter: blur(30px) saturate(190%); border-right: 0 !important; box-shadow: inset -1px 0 0 rgba(255, 255, 255, .6), 1px 0 0 rgba(58, 47, 40, .07) !important; }
  #tabs:hover { box-shadow: inset -1px 0 0 rgba(255, 255, 255, .6), var(--glass-shadow-lg) !important; }
  #tabs > button { border-radius: 14px; color: var(--ink2); transition: background .2s, color .2s, box-shadow .2s; }
  #tabs > button:hover { background: rgba(255, 255, 255, .55); color: var(--dark); }
  #tabs > button.is-active { background: var(--seg-on) !important; color: var(--brown) !important; box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(58, 47, 40, .08), 0 6px 16px -6px rgba(58, 47, 40, .25) !important; }
  #tabs > button.is-active .ic { color: var(--accent); }
  #tabs > button.is-active::before { display: none; }
}
@media (max-width: 700px) {
  .top { background: rgba(255, 253, 251, .88) !important; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .tabs { background: rgba(255, 253, 251, .94) !important; border-top: 0 !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8), 0 -8px 30px rgba(58, 47, 40, .14) !important; }
  .tabs > button.is-active { background: var(--seg-track) !important; color: var(--brown) !important; box-shadow: none !important; }
  .tabs > button.is-active .ic { color: var(--accent); }
}

/* сегменты — капсулы iOS: серый трек, белая «капля» */
.seg { background: var(--seg-track) !important; border: 0 !important; border-radius: 999px !important; padding: 3px; gap: 2px; overflow: visible; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .35); }
.seg button { background: transparent !important; border: 0 !important; border-radius: 999px !important; color: var(--dark) !important; font: 500 13px var(--body) !important; padding: 7px 15px; transition: background .2s, box-shadow .2s; }
.seg button + button { border-left: 0 !important; }
.seg button:hover:not(.is-active) { background: rgba(255, 255, 255, .45) !important; }
.seg button.is-active { background: var(--seg-on) !important; color: var(--brown) !important; font-weight: 650 !important; box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(58, 47, 40, .1), 0 3px 10px rgba(58, 47, 40, .12) !important; }

/* кнопки, поля */
.btn { border-radius: 999px !important; font: 600 13.5px/1 var(--body) !important; letter-spacing: 0 !important; text-transform: none !important; }
.btn:not(.btn--ghost):not(.btn--danger):not(.btn--light) { background: var(--brown); border-color: var(--brown); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 6px 18px -6px rgba(81, 68, 59, .55) !important; }
.btn--ghost { background: var(--glass-strong) !important; border: 0 !important; color: var(--brown) !important; box-shadow: var(--glass-hi), 0 2px 10px rgba(58, 47, 40, .08) !important; -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%); }
.btn--ghost:hover { background: #fff !important; color: var(--dark) !important; }
.btn--danger { border-radius: 999px; }
.ibtn { background: var(--glass-strong) !important; border: 0 !important; box-shadow: var(--glass-hi), 0 2px 10px rgba(58, 47, 40, .1) !important; color: var(--dark); transition: background .2s, transform .15s; }
.ibtn:hover { background: #fff !important; color: var(--dark) !important; transform: translateY(-1px); }
.ibtn:disabled { opacity: .4; cursor: default; transform: none; }
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea {
  border-radius: 12px !important; background: rgba(255, 255, 255, .78) !important; border: 1px solid rgba(58, 47, 40, .12) !important;
}
input:focus, select:focus, textarea:focus { outline: none !important; border-color: var(--accent) !important; box-shadow: 0 0 0 4px rgba(65, 125, 151, .18) !important; }

/* календарь */
.cal { border-radius: 22px; }
.wk__head { background: rgba(255, 253, 251, .86) !important; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-bottom: 1px solid rgba(58, 47, 40, .08) !important; }
.wk__day, .wk__col, .mo__c { border-color: rgba(58, 47, 40, .07) !important; }
.wk__col { background-image: repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--hour) - 1px), rgba(58, 47, 40, .07) calc(var(--hour) - 1px), rgba(58, 47, 40, .07) var(--hour)) !important; }
.wk__col.is-today { background-color: rgba(65, 125, 151, .05) !important; }
.wk__day.is-today b, .mo__c.is-today .mo__n { background: #c0392b !important; color: #fff !important; border-radius: 999px; padding: 0 9px; }
.ev { border-radius: 8px !important; border-left-width: 3px !important; box-shadow: 0 1px 2px rgba(58, 47, 40, .08); }
.chip { border-radius: 6px !important; }

/* окна и шторка — плотное стекло */
dialog { background: rgba(250, 247, 244, .9) !important; border: 0 !important; border-radius: 28px !important; -webkit-backdrop-filter: blur(40px) saturate(190%); backdrop-filter: blur(40px) saturate(190%); box-shadow: var(--glass-hi), var(--glass-shadow-lg) !important; }
dialog::backdrop { background: rgba(40, 32, 26, .24) !important; -webkit-backdrop-filter: blur(8px) saturate(140%); backdrop-filter: blur(8px) saturate(140%); }
.drawer { background: rgba(250, 247, 244, .88) !important; -webkit-backdrop-filter: blur(40px) saturate(190%); backdrop-filter: blur(40px) saturate(190%); box-shadow: var(--glass-hi), var(--glass-shadow-lg) !important; border-radius: 28px 0 0 28px !important; }
.overlay { background: rgba(40, 32, 26, .22) !important; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.drawer__close { width: 34px; height: 34px; border-radius: 50%; background: var(--seg-track) !important; font-size: 22px !important; display: grid; place-items: center; }
.status-btns button { background: var(--glass-strong) !important; border: 0 !important; box-shadow: var(--glass-hi), 0 1px 4px rgba(58, 47, 40, .08); }
.status-btns button.is-active { background: var(--brown) !important; color: #fff !important; }
@media (max-width: 700px) { dialog { border-radius: 26px 26px 0 0 !important; } .drawer { border-radius: 26px 26px 0 0 !important; } .dform__btns { background: transparent !important; } }
.toast { background: rgba(33, 27, 23, .86) !important; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-radius: 999px !important; }
.pstip, .ch__tip { border-radius: 12px !important; }

/* вход */
.gate__box { background: rgba(255, 253, 251, .7) !important; -webkit-backdrop-filter: blur(30px) saturate(190%); backdrop-filter: blur(30px) saturate(190%); box-shadow: var(--glass-hi), var(--glass-shadow-lg) !important; border-radius: 30px !important; }

/* мелочи: метки, теги, таблицы */
.tag, .fb, .st, .ps-pill { border-radius: 999px !important; }
.tbl th { color: var(--ink2) !important; }
.plist li button:hover { background: rgba(255, 255, 255, .5); }
@media (prefers-reduced-transparency: reduce) {
  .tile, .kpi, .panel, .cc, .cal, .plist, .pcard, .ps-tile, .ps-cr, dialog, .drawer, .top, #tabs { background: #fffdfb !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
}
@media print { body::before { display: none; } * { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; } }

/* ---------- Личное → Расходы ---------- */
.sp-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.sp-month { display: flex; align-items: center; gap: 10px; }
.sp-month h3 { font-size: 22px !important; min-width: 170px; text-align: center; }
.sp-add { margin-bottom: 18px; padding: 18px 20px !important; }
.sp-add__row { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
.sp-add__row label > span { display: block; font: 500 12px var(--body); color: var(--ink2); margin-bottom: 5px; }
.sp-amt { position: relative; flex: 0 0 210px; }
.sp-amt input { width: 100%; font: 700 26px/1 var(--head) !important; letter-spacing: -.02em; padding: 10px 40px 10px 14px; }
.sp-amt em { position: absolute; right: 14px; bottom: 12px; font: 600 20px var(--head); font-style: normal; color: var(--ink2); }
.sp-f input { padding: 12px 14px; font: 500 14px var(--body); min-height: 50px; }
.sp-f--grow { flex: 1 1 200px; } .sp-f--grow input { width: 100%; }
.sp-add .btn { min-height: 50px; padding: 0 26px; }
.sp-cats { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.sp-cat input { position: absolute; opacity: 0; pointer-events: none; }
.sp-cat span { display: inline-flex; align-items: center; gap: 7px; padding: 7px 13px 7px 8px; border-radius: 999px; background: rgba(255, 255, 255, .6); box-shadow: inset 0 0 0 1px rgba(58, 47, 40, .08); font: 500 13px var(--body); cursor: pointer; transition: background .15s, box-shadow .15s, color .15s; }
.sp-cat span i { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 13px; background: color-mix(in srgb, var(--c) 16%, #fff); }
.sp-cat span:hover { background: #fff; }
.sp-cat input:checked + span { background: var(--c); color: #fff; box-shadow: 0 4px 12px -4px color-mix(in srgb, var(--c) 70%, transparent); }
.sp-cat input:checked + span i { background: rgba(255, 255, 255, .25); }
.sp-cat input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.sp-ic { width: 38px; height: 38px; flex: none; border-radius: 12px; display: grid; place-items: center; font-style: normal; font-size: 18px; background: color-mix(in srgb, var(--c) 15%, #fff); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 22%, transparent); }
.sp-split { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); gap: 18px; align-items: start; }
.sp-split .dn__lg { display: none; }
.sp-split .dn__w { display: block; }
.sp-list { display: grid; gap: 4px; }
.sp-list li { display: flex; align-items: center; gap: 6px; border-radius: 14px; transition: background .15s; }
.sp-list li:hover, .sp-list li.is-on { background: rgba(255, 255, 255, .6); }
.sp-list li.is-on { box-shadow: inset 0 0 0 1px rgba(65, 125, 151, .35); }
.sp-list__b { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; padding: 8px 10px; border: 0; background: none; text-align: left; }
.sp-list__b > span { flex: 1; min-width: 0; display: grid; gap: 2px; }
.sp-list__b b { font: 600 14px var(--body); }
.sp-list__b small { font-size: 12px; color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-list li.is-over small { color: #b23a2b; font-weight: 600; }
.sp-list__b strong { font: 700 15px var(--head); letter-spacing: -.01em; white-space: nowrap; font-variant-numeric: tabular-nums; }
.sp-bar { display: block; height: 5px; border-radius: 3px; background: rgba(58, 47, 40, .08); overflow: hidden; margin-top: 3px; }
.sp-bar u { display: block; height: 100%; border-radius: 3px; background: var(--c); text-decoration: none; }
.sp-lim { flex: none; border: 0; background: var(--seg-track); border-radius: 999px; padding: 5px 10px; font: 500 11.5px var(--body); color: var(--ink2); margin-right: 8px; }
.sp-lim:hover { background: #fff; color: var(--dark); }
.sp-ops { margin-top: 20px; }
.sp-day { margin-top: 14px; }
.sp-day h4 { display: flex; justify-content: space-between; font: 600 13px var(--body) !important; letter-spacing: 0 !important; color: var(--ink2); padding: 0 10px 6px; border-bottom: 1px solid rgba(58, 47, 40, .08); }
.sp-day ul { display: grid; }
.sp-op { width: 100%; display: flex; align-items: center; gap: 12px; padding: 10px; border: 0; background: none; border-radius: 14px; text-align: left; transition: background .15s; }
.sp-op:hover { background: rgba(255, 255, 255, .6); }
.sp-op > span { flex: 1; min-width: 0; display: grid; gap: 1px; }
.sp-op b { font: 600 14px var(--body); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-op small { font-size: 12px; color: var(--ink2); }
.sp-op strong { font: 600 15px var(--body); font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 900px) { .sp-split { grid-template-columns: 1fr; } .sp-split #spDonut { max-width: 240px; margin: 0 auto; } }
@media (max-width: 700px) {
  .sp-amt { flex: 1 1 100%; } .sp-f { flex: 1 1 140px; } .sp-f input { width: 100%; } .sp-add .btn { flex: 1 1 100%; }
  .sp-cats { flex-wrap: nowrap; overflow-x: auto; margin-inline: -16px; padding: 2px 16px 6px; scrollbar-width: none; max-width: calc(100% + 32px); }
  .sp-add { overflow: hidden; }
  .sp-cats::-webkit-scrollbar { display: none; } .sp-cat span { white-space: nowrap; min-height: 40px; }
}

/* Apple: без капса — подписи обычным регистром, без разрядки (как в «Дилайт Сизон») */
* { text-transform: none !important; }
.alert b, .badge, .btn, .cat__h, .crdlg__grid h4, .dform label, .dp__pay label, .eyebrow, .field-label, .gc__h, .gform label, .hg header h3, .hs__r span, .kpi span, .kv dt, .ledger__t td.l-amt::before, .ledger__t td.l-cat::before, .ledger__t td.l-com::before, .ledger__t td.l-date::before, .mf > span:first-child, .mo__h, .pcard h4, .plan__t td.c-desc::before, .plan__t td.c-sum::before, .plan__t td.c-tooth::before, .plan-total span, .ps-tile small, .pstats span, .rem-prev span, .seg button, .st, .stage__title, .status-btns button, .step summary small, .sup__add label, .sup__num span, .tabs > button, .tag, .tbl th, .ti__hello span::first-letter, .ti__next small, .tile span, .top__brand, .top__brand span, .trf__k span, .visit__date, .wk__day small, .works__t td.w-com::before, .works__t td.w-date::before, .works__t td.w-src::before, .works__t td.w-sum::before, .works__t td.w-svc::before, .works__t td.w-tooth::before, /* карточка с двумя блоками полос (работа в клиниках) */
.cc h4, svg.psbody .bl { letter-spacing: 0 !important; }
.sp-add .sp-add__row label > span { display: block; }
.sp-add label.sp-cat > span { display: inline-flex; margin: 0; font: 500 13px var(--body); color: var(--dark); }
.sp-add label.sp-cat input:checked + span { color: #fff; }
.chip2 { background: var(--glass-strong) !important; border: 0 !important; border-radius: 999px !important; box-shadow: var(--glass-hi), 0 1px 4px rgba(58, 47, 40, .08); padding: 7px 14px !important; }
.dp { background: var(--glass-soft) !important; border: 0 !important; box-shadow: inset 4px 0 0 var(--dc), var(--glass-hi) !important; }
.dp__pay label { font: 500 12px var(--body) !important; }

/* =====================================================================
   «МОЙ КАБИНЕТ» — правая полоса как в «Дилайт Сизон»: свёрнута — аватар и значки,
   при наведении — тёмная стеклянная карточка (кофейное стекло, бирюза и персик)
   ===================================================================== */
.me-rail { display: none; }
@media (min-width: 1000px) {
  .app { padding-right: 96px; }
  .demo-banner, .role-note, .top { margin-right: -96px; }
  /* обе полосы «плавают»: отступ от краёв, большие скругления */
  #tabs { top: calc(var(--sidebarTop, 88px) + 10px) !important; left: 12px !important; bottom: 12px !important; width: 72px !important; padding: 14px 10px !important; border-radius: 30px !important;
    border: 1px solid rgba(255, 255, 255, .55) !important; box-shadow: 0 12px 40px rgba(58, 47, 40, .12), inset 0 1px 0 rgba(255, 255, 255, .6) !important; }
  #tabs:hover { width: 252px !important; box-shadow: 0 24px 60px rgba(58, 47, 40, .22), inset 0 1px 0 rgba(255, 255, 255, .6) !important; }
  #tabs.force-collapsed, #tabs.force-collapsed:hover { width: 72px !important; }
  #tabs > button { padding: 12px 11px !important; }
  #tabs > button .ic { width: 26px !important; height: 26px !important; }

  .me-rail { display: block; position: fixed; z-index: 45; top: calc(var(--sidebarTop, 88px) + 10px); right: 12px; bottom: 12px; width: 72px; border-radius: 30px; outline: none;
    background: rgba(255, 253, 251, .55); -webkit-backdrop-filter: blur(30px) saturate(190%); backdrop-filter: blur(30px) saturate(190%);
    border: 1px solid rgba(255, 255, 255, .55); box-shadow: 0 12px 40px rgba(58, 47, 40, .12), inset 0 1px 0 rgba(255, 255, 255, .6);
    transition: width .32s cubic-bezier(.22, 1, .36, 1), background .2s, box-shadow .2s; }
  .me-rail:hover, .me-rail:focus-within { width: 400px; background: transparent; border-color: transparent; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .me-r-mini { display: flex; flex-direction: column; align-items: center; gap: 14px; padding-top: 14px; transition: opacity .12s; }
  .me-rail:hover .me-r-mini, .me-rail:focus-within .me-r-mini { opacity: 0; }
  .me-av { width: 46px; height: 46px; flex: none; border-radius: 50%; display: grid; place-items: center; font: 700 15px var(--head); letter-spacing: .02em; color: #fff;
    background: linear-gradient(140deg, #e6a978 0%, #a0674a 55%, #51443b 100%); box-shadow: 0 0 0 3px rgba(214, 160, 110, .28), 0 6px 16px -6px rgba(81, 68, 59, .6); }
  .me-mi { position: relative; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 14px; color: var(--ink2); }
  .me-mi .ic { width: 24px; height: 24px; }
  .me-mi.on { background: #fff; color: var(--accent); box-shadow: inset 0 1px 0 #fff, 0 4px 12px -4px rgba(58, 47, 40, .25); }
  .me-mi b, .me-f-ic b, .me-f-acts i b { position: absolute; top: -3px; right: -3px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; background: #e5483b; color: #fff; font: 700 10px/17px var(--body); text-align: center; }

  /* раскрытая карточка */
  .me-r-full { position: absolute; top: 0; right: 0; bottom: 0; width: 376px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none;
    padding: 16px 18px 18px; border-radius: 30px; display: flex; flex-direction: column; gap: 16px; color: #f6efe8;
    --mi: rgba(246, 239, 232, .58); --ms: rgba(255, 255, 255, .06); --mh: rgba(255, 255, 255, .1);
    background: radial-gradient(120% 50% at 100% 0%, rgba(65, 125, 151, .28), transparent 60%), linear-gradient(180deg, rgba(58, 46, 38, .92), rgba(30, 24, 20, .95));
    -webkit-backdrop-filter: saturate(160%) blur(30px); backdrop-filter: saturate(160%) blur(30px);
    border: 1px solid rgba(255, 255, 255, .1); box-shadow: 0 30px 80px rgba(20, 12, 6, .5), inset 0 1px 0 rgba(255, 255, 255, .08);
    opacity: 0; visibility: hidden; transform: translateX(24px); transition: opacity .18s, transform .28s cubic-bezier(.22, 1, .36, 1), visibility .18s; }
  .me-r-full::-webkit-scrollbar { display: none; }
  .me-rail:hover .me-r-full, .me-rail:focus-within .me-r-full { opacity: 1; visibility: visible; transform: none; }
  .me-r-full button { font: inherit; color: inherit; }
  .me-f-top { display: flex; justify-content: space-between; }
  .me-f-ic { position: relative; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--mh); background: var(--ms); cursor: pointer; transition: background .15s, color .15s; }
  .me-f-ic .ic { width: 18px; height: 18px; }
  .me-f-ic:hover { background: rgba(255, 255, 255, .14); } .me-f-out:hover { background: rgba(229, 72, 59, .22); color: #ffb3ab; }
  .me-f-prof { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 2px; margin-top: -18px; }
  .me-f-prof .me-av { width: 64px; height: 64px; font-size: 21px; margin-bottom: 8px; box-shadow: 0 0 0 4px rgba(255, 255, 255, .08), 0 8px 24px rgba(0, 0, 0, .4); }
  .me-f-prof small { font-size: 11.5px; color: var(--mi); } .me-f-prof b { font: 700 18px var(--head); letter-spacing: -.02em; }
  .me-f-acts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px 6px; }
  .me-f-acts button { display: flex; flex-direction: column; align-items: center; gap: 6px; border: 0; background: none; cursor: pointer; color: var(--mi) !important; font-size: 10.5px !important; line-height: 1.2; text-align: center; padding: 0; }
  .me-f-acts i { position: relative; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 15px; background: var(--ms); border: 1px solid var(--mh); color: #f6efe8; font-style: normal; transition: background .15s, transform .15s; }
  .me-f-acts i .ic { width: 21px; height: 21px; }
  .me-f-acts button:hover i { background: rgba(255, 255, 255, .14); transform: translateY(-2px); } .me-f-acts button:hover { color: #f6efe8 !important; }
  .me-f-acts button.on i { background: linear-gradient(140deg, #f2bf8f, #cf6630); border-color: transparent; color: #2a1606; box-shadow: 0 6px 18px rgba(207, 102, 48, .38); }
  .me-f-acts button.on { color: #f6efe8 !important; font-weight: 600; }
  .me-f-acts button:active i { transform: scale(.95); }
  /* карта месяца — как банковская карта */
  .me-hero { position: relative; overflow: hidden; display: grid; gap: 2px; padding: 14px 16px; border-radius: 22px; border: 1px solid rgba(255, 255, 255, .14);
    background: radial-gradient(120% 90% at 0% 0%, rgba(230, 150, 90, .8), transparent 55%), radial-gradient(90% 80% at 100% 100%, rgba(45, 93, 120, .9), transparent 62%), linear-gradient(135deg, #5a4334, #2a2420);
    box-shadow: 0 14px 34px rgba(0, 0, 0, .4), inset 0 1px 0 rgba(255, 255, 255, .18); }
  .me-hero-h { display: flex; justify-content: space-between; align-items: center; font-size: 12px; color: rgba(255, 255, 255, .82); margin-bottom: 8px; }
  .me-hero-nav { display: flex; gap: 4px; }
  .me-hero-nav button { width: 24px; height: 24px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .14); cursor: pointer; font-size: 14px; line-height: 1; }
  .me-hero-nav button:hover { background: rgba(255, 255, 255, .28); }
  .me-hero small { font-size: 11px; color: rgba(255, 255, 255, .72); }
  .me-hero strong { font: 700 30px/1.1 var(--head); letter-spacing: -.025em; color: #fff; }
  .me-hero-f { display: flex; justify-content: space-between; gap: 6px; padding-top: 10px; margin-top: 10px; border-top: 1px solid rgba(255, 255, 255, .16); font-size: 11px; color: rgba(255, 255, 255, .72); }
  .me-hero-f span { display: grid; gap: 1px; } .me-hero-f b { font: 700 14px var(--head); color: #fff; } .me-hero-f .bad b { color: #ffb3a6; }
  .me-hero-chip { position: absolute; right: 14px; top: 38px; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; color: rgba(255, 255, 255, .9);
    background: linear-gradient(140deg, rgba(255, 255, 255, .32), rgba(255, 255, 255, .08)); border: 1px solid rgba(255, 255, 255, .25); }
  .me-hero-chip .ic { width: 20px; height: 20px; }
  /* мини-календарь */
  .me-cal { padding: 10px; border-radius: 20px; background: var(--ms); border: 1px solid var(--mh); }
  .me-cal-g { display: grid; grid-template-columns: repeat(7, 1fr); row-gap: 3px; text-align: center; }
  .me-w { font-size: 10px; color: var(--mi); padding-bottom: 3px; }
  .me-c { position: relative; display: grid; place-items: center; height: 34px; border: 0; background: none; cursor: pointer; padding: 0; }
  .me-c b { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 50%; font-size: 12px; font-weight: 500; transition: transform .12s, background .12s; }
  .me-c:hover b { background: rgba(255, 255, 255, .12); transform: scale(1.08); }
  .me-c.has b { background: #a8754a; color: #fff; font-weight: 700; } .me-c.has:hover b { background: #5a9bb6; }
  .me-c.f-overdue b { background: #e5483b; }
  .me-c.today b { box-shadow: 0 0 0 2px #f2bf8f; font-weight: 800; } .me-c.today:not(.has) b { color: #f2bf8f; }
  .me-c em { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; }
  .me-c em i { width: 4px; height: 4px; border-radius: 50%; background: #e6a978; }
  .me-cal-l { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px; margin-top: 8px; font-size: 10.5px; color: var(--mi); }
  .me-cal-l i { width: 8px; height: 8px; border-radius: 50%; margin-left: 6px; } .me-cal-l i:first-child { margin-left: 0; }
  .me-cal-l .l1 { background: #a8754a; } .me-cal-l .l2 { background: #e5483b; } .me-cal-l .l3 { width: 5px; height: 5px; background: #e6a978; }
  /* ближайшие приёмы */
  .me-f-h { font-weight: 700; font-size: 14px; margin-bottom: -6px; }
  .me-f-list { display: flex; flex-direction: column; gap: 8px; }
  .me-t { display: flex; align-items: center; gap: 10px; padding: 10px; border-radius: 16px; background: var(--ms); border: 1px solid var(--mh); text-align: left; cursor: pointer; transition: background .15s; }
  .me-t:hover { background: rgba(255, 255, 255, .11); }
  .me-t-d { width: 40px; height: 40px; flex: none; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 9.5px; line-height: 1; color: var(--mi); background: rgba(255, 255, 255, .09); }
  .me-t-d b { font-size: 14px; color: #f6efe8; margin-bottom: 1px; }
  .me-t-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
  .me-t-t b { font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .me-t-t small { font-size: 10.5px; color: var(--mi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .me-t em { flex: none; font-style: normal; font-size: 10.5px; font-weight: 600; padding: 3px 9px; border-radius: 999px; color: #9fd0e4; background: rgba(65, 125, 151, .2); border: 1px solid rgba(90, 155, 182, .45); }
  .me-t.k-today em { color: #ffcf9e; background: rgba(230, 150, 90, .18); border-color: rgba(230, 150, 90, .45); }
  .me-t.k-overdue em { color: #ff9d92; background: rgba(229, 72, 59, .16); border-color: rgba(229, 72, 59, .45); }
  .me-empty { font-size: 12.5px; color: var(--mi); padding: 6px 2px; }
  .me-f-all { display: flex; justify-content: space-between; align-items: center; padding: 12px 14px; border-radius: 14px; background: var(--ms); border: 1px solid var(--mh); color: var(--mi) !important; font-size: 12.5px !important; cursor: pointer; transition: background .15s, color .15s; }
  .me-f-all:hover { background: rgba(255, 255, 255, .1); color: #f6efe8 !important; }
}
@media (min-width: 1000px) and (prefers-reduced-motion: reduce) { .me-rail, .me-r-full { transition: none; } }
@media (min-width: 1000px) and (max-width: 1560px) { .gg { grid-template-columns: minmax(130px, 180px) minmax(0, 1fr); gap: 16px; } .gg__list li span { font-size: 12px; } }
@media (min-width: 1000px) { .me-r-full > * { flex-shrink: 0; } }

/* =====================================================================
   ОДНА ПАНЕЛЬ СЛЕВА: свёрнута — аватар и значки разделов, при наведении — карточка «Мой кабинет»
   (правая полоса убрана; .me-r-full — оформление карточки из блока выше)
   ===================================================================== */
.tabs__av, #meCard { display: none; }
@media (min-width: 1000px) {
  .app { padding-right: 0 !important; }
  .demo-banner, .role-note, .top { margin-right: 0 !important; }
  .me-rail { display: none !important; }
  .tabs__av { display: grid; flex: none; align-self: center; width: 46px !important; height: 46px !important; margin: 2px 0 10px; font-size: 15px; }
  #tabs > :not(#meCard) { transition: opacity .12s; }
  #tabs:hover:not(.force-collapsed):not(.me-shut) { width: 400px !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important;
    -webkit-backdrop-filter: none !important; backdrop-filter: none !important; transition: width .32s cubic-bezier(.22, 1, .36, 1) .1s, background .2s .1s; }
  #tabs:hover:not(.force-collapsed):not(.me-shut) > :not(#meCard) { opacity: 0; pointer-events: none; transition-delay: .1s; }
  #tabs.me-shut, #tabs.me-shut:hover { width: 72px !important; }
  #tabs.me-shut > button span { opacity: 0 !important; }
  #meCard { display: flex; left: 0; right: auto; transform: translateX(-16px); }
  #tabs:hover:not(.force-collapsed):not(.me-shut) #meCard { opacity: 1; visibility: visible; transform: none; transition-delay: .12s; }
  .me-f-r { display: flex; gap: 8px; }
  .me-f-acts button.cta i { background: linear-gradient(140deg, #6b5a4c, #3e332c); border-color: rgba(255, 255, 255, .18); }
  .me-f-acts button.cta { color: #f6efe8 !important; }
  .me-hero-cl { margin-top: 10px; padding: 8px 10px; border-radius: 12px; border: 1px solid rgba(255, 255, 255, .18); background: rgba(255, 255, 255, .1); text-align: left; font-size: 11.5px; color: rgba(255, 255, 255, .85); cursor: pointer; }
  .me-hero-cl b { color: #fff; } .me-hero-cl:hover { background: rgba(255, 255, 255, .18); }
}

/* ---------- зарплата в клиниках: план → факт ---------- */
.cp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.cp { border-radius: 18px; padding: 14px 16px; background: var(--glass-soft); box-shadow: inset 4px 0 0 var(--c), var(--glass-hi); display: grid; gap: 10px; align-content: start; }
.cp header { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.cp header b { font: 700 16px var(--head); letter-spacing: -.015em; }
.cp-wait { font: 600 12px var(--body); color: #8a5a10; background: #fff1d6; padding: 3px 10px; border-radius: 999px; white-space: nowrap; }
.cp-ok { font: 600 12px var(--body); color: #23502c; background: #e5f3e8; padding: 3px 10px; border-radius: 999px; }
.cp-sh, .cp-hist { display: grid; gap: 4px; }
.cp-sh li { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; }
.cp-sh .link { font-size: 13px; opacity: .9; text-decoration: none; } .cp-sh .link:hover { text-decoration: underline; }
.cp-sh b { font-variant-numeric: tabular-nums; }
.cp .btn { justify-self: start; }
.cp-hist { border-top: 1px solid rgba(58, 47, 40, .08); padding-top: 8px; }
.cp-h { width: 100%; display: flex; align-items: center; gap: 8px; border: 0; background: none; padding: 6px 4px; border-radius: 10px; text-align: left; cursor: pointer; font-size: 13px; }
.cp-h:hover { background: rgba(255, 255, 255, .6); }
.cp-h span { flex: 1; display: grid; } .cp-h small { font-size: 11.5px; color: var(--ink2); }
.cp-h b { font-variant-numeric: tabular-nums; }
.cp-diff { font-style: normal; font-weight: 600; font-size: 12px; padding: 1px 7px; border-radius: 999px; white-space: nowrap; }
.cp-diff.neg { color: #a4382b; background: #fde8e4; } .cp-diff.pos { color: #23502c; background: #e5f3e8; }
.cp-pick { display: grid; gap: 4px; max-height: 260px; overflow-y: auto; padding: 4px; border-radius: 14px; background: rgba(255, 255, 255, .5); }
.cp-pick .cat__chk { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 10px; }
.cp-pick .cat__chk:hover { background: rgba(255, 255, 255, .7); }
.cp-pick .cat__chk span { flex: 1; } .cp-pick .cat__chk b { font-variant-numeric: tabular-nums; }
.cp-sum { font-size: 13px; color: var(--ink2); margin: 2px 0 6px; }
.cp-st { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 10px 14px; border-radius: 14px; font-size: 13px; margin: 2px 0 10px; }
.cp-st--ok { background: #e5f3e8; color: #23502c; } .cp-st--wait { background: #fff1d6; color: #6b4a0c; }
#fWeeks { overflow-x: auto; }               /* недельная таблица на телефоне — прокрутка внутри, а не вся страница */
@media (max-width: 700px) { .trf, .trf__k { grid-template-columns: minmax(0, 1fr) !important; } .trf > * { min-width: 0; } }   /* посещаемость сайта на телефоне не шире экрана */
@media (min-width: 1000px) { .me-cal-h { display: flex; justify-content: space-between; align-items: center; padding: 2px 4px 8px; font: 600 13px var(--body); } .me-cal-h .me-hero-nav button { color: #f6efe8; } }

/* ===== карточка «Мой кабинет» — светлая, как весь кабинет: молочное стекло, тёмный текст, акценты бирюза/персик ===== */
@media (min-width: 1000px) {
  #tabs #meCard {
    --mi: var(--ink2); --ms: rgba(255, 255, 255, .62); --mh: rgba(58, 47, 40, .08);
    color: var(--dark);
    background: radial-gradient(120% 45% at 100% 0%, rgba(65, 125, 151, .10), transparent 60%), radial-gradient(90% 40% at 0% 100%, rgba(214, 160, 110, .14), transparent 60%), rgba(252, 249, 246, .9);
    -webkit-backdrop-filter: blur(34px) saturate(180%); backdrop-filter: blur(34px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, .75);
    box-shadow: inset 0 1px 0 #fff, 0 2px 6px rgba(58, 47, 40, .06), 0 30px 70px -18px rgba(58, 47, 40, .35);
  }
  #tabs #meCard .me-f-ic { background: rgba(255, 255, 255, .75); border-color: var(--mh); color: var(--ink2); box-shadow: 0 1px 3px rgba(58, 47, 40, .06); }
  #tabs #meCard .me-f-ic:hover { background: #fff; color: var(--dark); }
  #tabs #meCard .me-f-out:hover { background: #fde8e4; color: #b23a2b; }
  #tabs #meCard .me-f-prof .me-av { box-shadow: 0 0 0 4px rgba(255, 255, 255, .9), 0 8px 22px -6px rgba(81, 68, 59, .45); }
  #tabs #meCard .me-f-prof small { color: var(--ink2); } #tabs #meCard .me-f-prof b { color: var(--dark); }
  #tabs #meCard .me-f-acts button { color: var(--ink2) !important; }
  #tabs #meCard .me-f-acts button:hover { color: var(--dark) !important; }
  #tabs #meCard .me-f-acts i { background: rgba(255, 255, 255, .75); border-color: var(--mh); color: var(--brown); box-shadow: 0 1px 3px rgba(58, 47, 40, .06); }
  #tabs #meCard .me-f-acts button:hover i { background: #fff; box-shadow: 0 6px 16px -6px rgba(58, 47, 40, .3); }
  #tabs #meCard .me-f-acts button.on i { background: linear-gradient(140deg, #f2bf8f, #cf6630); color: #fff; border-color: transparent; box-shadow: 0 6px 18px -4px rgba(207, 102, 48, .45); }
  #tabs #meCard .me-f-acts button.cta i { background: linear-gradient(140deg, #6b5a4c, #3e332c); color: #fff; border-color: transparent; }
  #tabs #meCard .me-f-acts button.on, #tabs #meCard .me-f-acts button.cta { color: var(--dark) !important; }
  #tabs #meCard .me-cal { background: rgba(255, 255, 255, .6); border-color: var(--mh); }
  #tabs #meCard .me-cal-h { color: var(--dark); }
  #tabs #meCard .me-cal-h .me-hero-nav button { background: var(--seg-track); color: var(--dark); }
  #tabs #meCard .me-cal-h .me-hero-nav button:hover { background: #fff; }
  #tabs #meCard .me-w, #tabs #meCard .me-cal-l { color: var(--ink2); }
  #tabs #meCard .me-c b { color: var(--dark); }
  #tabs #meCard .me-c:hover b { background: rgba(58, 47, 40, .07); }
  #tabs #meCard .me-c.has b { background: #a8754a; color: #fff; } #tabs #meCard .me-c.has:hover b { background: #5a9bb6; }
  #tabs #meCard .me-c.f-overdue b { background: #d9534a; color: #fff; }
  #tabs #meCard .me-c.today b { box-shadow: 0 0 0 2px #e6a978; } #tabs #meCard .me-c.today:not(.has) b { color: #cf6630; }
  #tabs #meCard .me-f-h { color: var(--dark); }
  #tabs #meCard .me-t { background: rgba(255, 255, 255, .62); border-color: var(--mh); }
  #tabs #meCard .me-t:hover { background: #fff; box-shadow: 0 6px 16px -8px rgba(58, 47, 40, .3); }
  #tabs #meCard .me-t-d { background: var(--seg-track); color: var(--ink2); } #tabs #meCard .me-t-d b { color: var(--dark); }
  #tabs #meCard .me-t-t small { color: var(--ink2); }
  #tabs #meCard .me-t em { color: #2c6b85; background: rgba(65, 125, 151, .12); border-color: rgba(65, 125, 151, .3); }
  #tabs #meCard .me-t.k-today em { color: #a4561f; background: rgba(230, 150, 90, .16); border-color: rgba(230, 150, 90, .45); }
  #tabs #meCard .me-t.k-overdue em { color: #b23a2b; background: rgba(229, 72, 59, .1); border-color: rgba(229, 72, 59, .35); }
  #tabs #meCard .me-empty { color: var(--ink2); }
  #tabs #meCard .me-f-all { background: rgba(255, 255, 255, .62); border-color: var(--mh); color: var(--ink2) !important; }
  #tabs #meCard .me-f-all:hover { background: #fff; color: var(--dark) !important; }
}

/* ===== меню при наведении: значки НЕ двигаются — рядом появляются подписи, справа открывается колонка
   с календарём и ближайшими приёмами. Одна светлая панель вместо отдельной карточки поверх меню. ===== */
@media (min-width: 1000px) {
  #tabs:hover:not(.force-collapsed):not(.me-shut) {
    width: 620px !important; background: rgba(252, 249, 246, .94) !important; border-color: rgba(255, 255, 255, .8) !important;
    -webkit-backdrop-filter: blur(30px) saturate(180%) !important; backdrop-filter: blur(30px) saturate(180%) !important;
    box-shadow: inset 0 1px 0 #fff, 0 2px 6px rgba(58, 47, 40, .06), 0 30px 70px -18px rgba(58, 47, 40, .35) !important;
  }
  #tabs:hover:not(.force-collapsed):not(.me-shut) > :not(#meCard) { opacity: 1 !important; pointer-events: auto !important; }
  #tabs > button { max-width: 214px; }
  #tabs > .tabs__av { align-self: flex-start; margin-left: 3px; }
  #tabs #meCard {
    left: 238px !important; right: 12px !important; top: 12px !important; bottom: 12px !important; width: auto !important;
    padding: 16px !important; gap: 14px; border-radius: 22px !important; transform: translateX(12px);
    background: rgba(255, 255, 255, .58) !important; border: 1px solid rgba(58, 47, 40, .06) !important; box-shadow: none !important;
    -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
  }
  #tabs:hover:not(.force-collapsed):not(.me-shut) #meCard { transform: none; }
  .me-head { display: grid; gap: 2px; padding: 2px 4px 2px; }
  .me-head b { font: 700 17px var(--head); letter-spacing: -.02em; color: var(--dark); }
  .me-head small { font-size: 12px; color: var(--ink2); }
  .me-head small::first-letter { text-transform: uppercase; }
}
.ps-credits { margin-top: 20px; } .ps-credits .ps-cards { margin-top: 12px; } .ps-h4 { font: 600 13px var(--body) !important; color: var(--ink2); margin: 10px 0 6px; }
.cp header { flex-wrap: wrap; }
.cp-adv { font: 600 12px var(--body); color: #2c6b85; background: rgba(65, 125, 151, .12); padding: 3px 10px; border-radius: 999px; white-space: nowrap; }
.cp-sh b small { font-weight: 500; color: var(--ink2); }
.cp-kind { margin: 4px 0 2px; align-self: start; width: fit-content; }
.cp-pick .cat__chk small { display: block; font-size: 11.5px; color: #8a5a10; }
.cp-bal { display: flex; justify-content: space-between; gap: 10px; font-size: 12.5px; color: var(--ink2); }
.cp-bal b { color: var(--dark); font-variant-numeric: tabular-nums; }
.cp-meter { display: block; height: 6px; border-radius: 3px; background: rgba(58, 47, 40, .08); overflow: hidden; margin-top: -4px; }
.cp-meter em { display: block; height: 100%; border-radius: 3px; background: var(--c); }
.cp-in { display: flex; gap: 8px; align-items: center; }
.cp-in__amt { flex: 1; min-width: 0; } .cp-in__amt input { width: 100%; }
.cp-in input { padding: 9px 12px; font: 600 14px var(--body); min-height: 40px; }
.cp-in input[type=date] { width: 150px; font-weight: 500; }
.cp-quick { display: flex; flex-wrap: wrap; gap: 6px; margin-top: -4px; }
.cp-quick button { border: 0; background: var(--seg-track); border-radius: 999px; padding: 5px 11px; font: 500 12px var(--body); color: var(--ink2); cursor: pointer; }
.cp-quick button:hover { background: #fff; color: var(--dark); }
.cp-h.is-wo b { color: var(--ink2); }
.cp-wo { justify-self: start; font-size: 12px; }
@media (max-width: 700px) { .cp-in { flex-wrap: wrap; } .cp-in input[type=date] { flex: 1; width: auto; } }
.cp-in { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.cp-in__amt { grid-column: 1 / -1; }
.cp-in__amt input { font: 700 18px var(--head) !important; letter-spacing: -.01em; min-height: 46px; }
.cp-in input[type=date] { width: 100% !important; }

/* ---------- «Ждём денег от клиник» ---------- */
.cp-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; font: 600 13.5px var(--body); color: var(--ink2); }
.cp-advnote { font-size: 13px; color: #2c6b85; background: rgba(65, 125, 151, .1); border-radius: 12px; padding: 8px 12px; margin-bottom: 10px; }
.cp-list { display: grid; gap: 6px; }
.cp-list li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto auto; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 14px; background: rgba(255, 255, 255, .6); box-shadow: inset 0 0 0 1px rgba(58, 47, 40, .06); transition: background .15s, box-shadow .15s; }
.cp-list li:hover { background: #fff; }
.cp-list li.is-sel { background: #fff; box-shadow: inset 0 0 0 2px rgba(65, 125, 151, .45); }
.cp-chk input { width: 20px; height: 20px; accent-color: var(--accent); cursor: pointer; }
.cp-row { display: flex; align-items: center; gap: 10px; min-width: 0; border: 0; background: none; padding: 0; text-align: left; cursor: pointer; font: inherit; }
.cp-row i { width: 10px; height: 10px; border-radius: 50%; background: var(--c); flex: none; }
.cp-row b { font: 600 14px var(--body); white-space: nowrap; }
.cp-row span { font-size: 13px; color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-list strong { font: 700 15px var(--head); letter-spacing: -.01em; text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.cp-list strong small { display: block; font: 500 11px var(--body); color: #8a5a10; }
.cp-got { white-space: nowrap; }
.cp-more { width: 34px !important; height: 34px !important; font-size: 18px; }
.cp-bar { position: sticky; bottom: 12px; z-index: 5; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; padding: 12px 14px; border-radius: 18px;
  background: rgba(252, 249, 246, .96); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); box-shadow: inset 0 0 0 1px rgba(65, 125, 151, .35), 0 12px 30px -12px rgba(58, 47, 40, .35); }
.cp-bar > span { font: 600 13.5px var(--body); flex: 1 1 100%; }
.cp-bar label { display: flex; align-items: center; gap: 8px; font: 500 13px var(--body); color: var(--ink2); }
.cp-bar input[name=amount] { width: 150px; font: 700 17px var(--head) !important; padding: 8px 12px; }
.cp-bar input[type=date] { width: 150px; padding: 8px 10px; }
.cp-tip { font-size: 12.5px; color: var(--ink2); margin-top: 10px; }
#cpayPanel .cp-hist { margin-top: 4px; border-top: 0; padding-top: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 4px 14px; }
@media (max-width: 700px) {
  .cp-list li { grid-template-columns: auto minmax(0, 1fr) auto; }
  .cp-list .cp-got { grid-column: 2 / 3; justify-self: start; } .cp-list .cp-more { grid-column: 3; }
  .cp-row { flex-wrap: wrap; row-gap: 2px; }
}
@media (max-width: 700px) { .cp-bar { bottom: calc(84px + env(safe-area-inset-bottom)); } .cp-bar input[name=amount], .cp-bar input[type=date] { flex: 1 1 130px; width: auto; } }

/* профиль врача: поле «О себе» и блок «Ваш врач» у ассистента */
#profileForm textarea { font: inherit; width: 100%; padding: 10px 12px; border-radius: 12px; border: 1px solid rgba(0,0,0,.14); background: rgba(255,255,255,.7); resize: vertical; }
.me-doc { margin: 10px 0 4px; padding: 10px 12px; border-radius: 14px; background: rgba(255,255,255,.55); display: grid; gap: 2px; }
.me-doc span { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; opacity: .65; }
.me-doc small { opacity: .75; }
.me-doc p { margin: 4px 0 0; font-size: .85rem; }
.tabs__av .ic { width: 18px; height: 18px; }

/* ===== access.js: ассистент на приёме, подписка, карта специалиста ===== */
#prSpec, .sc__f select, .sc__f input { width: 100%; font: 400 14px/1.5 var(--body); padding: 10px 12px; background: var(--white); border: 1px solid var(--line-strong); color: var(--dark); border-radius: 12px; outline: none; }
#prSpec:focus, .sc__f select:focus, .sc__f input:focus { border-color: var(--accent); }
.spec-note { font-size: 12.5px; color: #5d544c; background: var(--bg); border-radius: 12px; padding: 10px 12px; margin-top: 6px; line-height: 1.45; }
.asg-m { display: inline-grid; place-items: center; width: 15px; height: 15px; margin-left: 4px; border-radius: 50%; font: 700 9px/1 var(--body); font-style: normal; color: #fff; background: #3f8a5a; vertical-align: 1px; }
.asg-m--proposed { background: transparent; color: #b07a12; border: 1.5px dashed #b07a12; }
.asg-dot { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 6px; border-radius: 999px; background: #c2512f; color: #fff; font: 700 10.5px/1 var(--body); font-style: normal; }
.asg-inbox { display: grid; gap: 8px; margin: 0 0 14px; padding: 14px 16px; border-radius: 18px; background: #fff7e6; border: 1px solid #edd9a8; }
.asg-inbox__h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.asg-inbox__h b { font-size: 14px; } .asg-inbox__h span, .asg-inbox__wait { font-size: 12.5px; color: #6b5a33; }
.asg-card { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 10px 12px; border-radius: 14px; background: var(--white); border-left: 4px solid var(--c); }
.asg-card__t { display: grid; gap: 2px; text-align: left; background: none; border: 0; padding: 0; min-width: 0; }
.asg-card__t b { font-size: 13.5px; text-transform: capitalize; } .asg-card__t span { font-size: 12.5px; color: #5d544c; }
.asg-card__a { display: flex; gap: 6px; }
.asg-box { margin: 4px 0 14px; padding: 12px 14px; border-radius: 14px; background: var(--bg); }
.asg-box p { font-size: 13.5px; margin: 2px 0 8px; } .asg-box--declined { background: #fbeee9; } .asg-box--accepted { background: #eaf4ec; }
.asg-st--proposed { color: #8a5d00; } .asg-st--accepted { color: #2f6b3f; } .asg-st--declined { color: #a4523d; }
.asg-acts { display: flex; gap: 8px; }
.asg-line { display: flex; gap: 10px; align-items: baseline; font-size: 13px; color: #6b6258; margin: 0 0 12px; }
/* подписка */
.sub-plan { font: 600 13px var(--body); padding: 6px 12px; border-radius: 999px; background: var(--brown); color: #f6f1ec; }
.sub-users { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 16px; background: var(--bg); margin: 4px 0 14px; }
.sub-users b { font: 600 34px/1 var(--head); color: var(--brown); } .sub-users span { font-size: 13px; color: #4a423b; }
.sub-meters { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin-bottom: 16px; }
.sub-m { padding: 12px 14px; border: 1px solid var(--line); border-radius: 14px; display: grid; gap: 6px; }
.sub-m__t { display: flex; justify-content: space-between; gap: 8px; font-size: 12.5px; } .sub-m__t b { font-size: 14px; }
.sub-m__bar { height: 7px; border-radius: 999px; background: var(--bg-tint); overflow: hidden; } .sub-m__bar i { display: block; height: 100%; background: var(--accent); border-radius: 999px; }
.sub-m__bar.is-inf { background: repeating-linear-gradient(90deg, #d9e8ee 0 8px, #eef5f8 8px 16px); }
.sub-m small { font-size: 11.5px; color: #8a8177; } .sub-m.is-over { border-color: #e2b4a4; background: #fcf1ed; } .sub-m.is-over .sub-m__bar i { background: #c2512f; } .sub-m.is-over small { color: #a4523d; }
.sub-plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.sub-p { display: grid; gap: 6px; align-content: start; padding: 16px; border: 1px solid var(--line-strong); border-radius: 18px; }
.sub-p.is-cur { border: 2px solid var(--brown); background: #fbf8f5; }
.sub-p > b { font: 600 20px var(--head); text-transform: uppercase; } .sub-p__price { font: 600 26px/1 var(--head); } .sub-p__price small { font: 400 12px var(--body); color: #6b6258; }
.sub-p__year { font-size: 11.5px; color: #3f7a52; } .sub-p ul { font-size: 12.5px; display: grid; gap: 3px; margin: 4px 0; } .sub-p li::before { content: "✓ "; color: var(--accent); }
.sub-p p { font-size: 12px; color: #6b6258; } .sub-p__cur { font: 600 12px var(--body); color: var(--brown); padding: 9px 0; }
.sub-terms { margin-top: 12px; display: block; }
/* карта специалиста */
.sc { border: 1px solid var(--line); border-radius: 18px; padding: 14px 16px; margin-bottom: 16px; background: linear-gradient(180deg, #fbf6ef, var(--white)); }
.sc__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.sc__head b { font: 600 18px var(--head); text-transform: uppercase; letter-spacing: .03em; display: block; } .sc__head small { font-size: 12px; color: var(--accent); font-weight: 600; }
.sc__ins { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px; margin-bottom: 12px; }
.sci { display: grid; gap: 3px; align-content: start; padding: 10px 12px; border-radius: 14px; background: var(--white); border: 1px solid var(--line); border-left: 4px solid #8fb8c8; }
.sci b { font: 600 19px/1.1 var(--head); } .sci span { font-size: 12px; color: #4a423b; line-height: 1.4; } .sci .link { justify-self: start; font-size: 12px; margin-top: 2px; }
.sci--ok { border-left-color: #5f9a6e; } .sci--warn { border-left-color: #d49a2a; background: #fffaf0; } .sci--bad { border-left-color: #c2512f; background: #fdf3ef; } .sci--mute { border-left-color: var(--line-strong); }
.sci__bar { display: block; height: 5px; border-radius: 999px; background: var(--bg-tint); overflow: hidden; } .sci__bar i { display: block; height: 100%; background: var(--accent); }
.sc__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 8px 12px; }
.sc__f { display: grid; gap: 4px; font-size: 12px; color: #5d544c; } .sc__f input, .sc__f select { padding: 8px 10px; font-size: 13.5px; border-radius: 10px; }
.sc--empty { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; background: var(--bg); } .sc--empty span { font-size: 12.5px; color: #5d544c; flex: 1 1 260px; }
.lg-more { border-style: dashed !important; color: var(--accent) !important; }
@media (max-width: 600px) { .asg-card__a { width: 100%; } .asg-card__a .btn { flex: 1; } .sub-users b { font-size: 28px; } }
.teeth__sides.is-dent { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 0 10px; max-width: 520px; }
.sub-terms { color: #6b6258 !important; font-weight: 400; }

/* анатомическая карта: объёмные мышцы, отмеченные — красные */
#tab-personal, #psDlg { --ps-mus-edge: #c3ae9b; }
svg.psbody .ps-edge { fill: none; stroke: #c9b6a4; stroke-width: .8; }
svg.psbody .ps-line { fill: none; stroke: #cdb9a6; stroke-width: .6; stroke-linecap: round; }
svg.psbody .ps-knee { fill: #eadfd3; stroke: #cdb9a6; stroke-width: .5; }
svg.psbody .ps-navel { fill: #d6c4b2; stroke: none; }
svg.psbody .muscle-on { stroke: #9e2a21; stroke-width: .6; }
.muscle.on, .muscle-on { filter: none; }
svg.psbody:not(.mini) .muscle-on { filter: drop-shadow(0 0 2px rgba(214, 70, 52, .35)); }
.muscle.hit:not(.on):hover { fill: #f2c4b8; }
.heatleg i { background: linear-gradient(90deg, rgba(226, 83, 63, .3), #a62c22); }
.gc__d.is-on svg.psbody .ps-edge { stroke: #b9a48f; }
/* женская / мужская фигура */
svg.psbody .ps-hair { fill: #b79c86; stroke: #9c8270; stroke-width: .5; }
svg.psbody .ps-breast { fill: none; stroke: #b59b85; stroke-width: .8; stroke-linecap: round; }
svg.psbody .ps-shadow { fill: rgba(81, 68, 59, .12); stroke: none; }
.ps-sex button { min-width: 92px; }
.gbody__top { display: flex; justify-content: center; margin: 4px 0 6px; }
/* «Зал»: ровные ряды табличек */
.ps-tiles { align-items: stretch; }
.ps-tiles .ps-tile { min-height: 116px; align-content: space-between; }
.ps-grid { align-items: stretch; }
.ps-grid > .panel { margin-bottom: 0; display: flex; flex-direction: column; min-width: 0; }
.panel.ps-dark { background: linear-gradient(155deg, #3d4b37, #2c3628) !important; border-color: transparent !important; color: #f4f1ea; }
.ps-dark svg.psweeks { margin: auto 0; }
.ps-row { align-items: center; }
.ps-row__r { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; justify-content: flex-end; }
.gstat { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); flex: 1; gap: 18px; }
.gstat svg.psbody { max-width: 290px; }
.ps-pills { margin-top: auto; padding-top: 12px; }
.ps-last { flex: 1; align-content: start; }
.ps-last li { min-height: 52px; padding: 6px 0; }
.ps-last li .ps-rest { min-width: 112px; }
.gmini { width: 44px; height: 44px; background: #f3ece4; border: 1px solid var(--line); }
.gmini svg.psbody.mini { height: 36px; }
.gc__d { min-height: 70px; }
.gc__d svg.psbody.mini { height: 30px; justify-self: center; }
@media (max-width: 700px) { .gstat { grid-template-columns: 1fr; } .ps-row__r { justify-content: flex-start; } .gc__d { min-height: 50px; } .gc__d svg.psbody.mini { height: 22px; } }
#tab-personal .panel.ps-dark, #tab-overview .panel.ps-dark { background: linear-gradient(155deg, #3d4b37, #2c3628) !important; border-color: transparent !important; color: #f4f1ea !important; }
#tab-personal .ps-dark h3 { color: #f4f1ea !important; } #tab-personal .ps-dark .panel__sub { color: rgba(244, 241, 234, .72) !important; }
.ps-tiles .ps-tile { align-content: start; }

/* наведение на мышцу: подсветка, контур и подпись */
svg.psbody:not(.mini) .mg { cursor: pointer; }
svg.psbody:not(.mini) .mg > path { transition: filter .18s ease, stroke .18s ease, stroke-width .18s ease, fill .18s ease; }
svg.psbody:not(.mini) .mg:hover > path { stroke: #8f241b; stroke-width: 1.1; filter: brightness(1.07) drop-shadow(0 0 2.6px rgba(214, 70, 52, .7)); }
svg.psbody:not(.mini) .mg:hover > .muscle:not(.on) { fill: #f3c3b5; }
svg.psbody:not(.mini) .heart { transition: filter .18s ease; } svg.psbody:not(.mini) .heart:hover { filter: drop-shadow(0 0 3px rgba(214, 54, 74, .8)); }
/* волосы: тёмные, чёткий контур и пряди */
svg.psbody .ps-hair { fill: #5b3c2a; stroke: #2f1d13; stroke-width: .55; }
svg.psbody .ps-hair--m { fill: #4a3123; }
svg.psbody .ps-hairline { fill: none; stroke: rgba(255, 224, 196, .38); stroke-width: .45; stroke-linecap: round; }
svg.psbody.mini .ps-hair { stroke-width: .3; }