/* Studio CRM — оформление. Основа — дизайн-система Licensia (токены, кнопки, поля, окна), под творческие профессии. */
/* Темы: data-theme = film (по умолчанию) | darkroom | lens | mono, data-mode = light | dark на <html> (ставит www/theme.js до отрисовки) */
:root{
  --radius:12px; --sans:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
:root,[data-theme="film"]{
  --paper:#F4EFEA;
  --surface:#FFFFFF;
  --surface-2:#FAF7F4;
  --ink:#1E1915;
  --muted:#6E625A;
  --faint:#726962;
  --border:#E8DFD7;
  --border-strong:#D6CABF; --field-border:#8E857E;
  --navy:#2A211C;
  --navy-2:#3A2E26;
  --navy-act:#4A3A30;
  --side-ink:#E9DED4;
  --side-ink-2:#BCAEA2;
  --brand:#B05A26;
  --brand-2:#8C451A;
  --brand-bg:#F6E7DC;
  --today-bg:#FFFBF7;
  --auth-glow:#F6E6DA;
  --focus:rgba(176,90,38,.2);
  --link:#226EB5;
  --paid:#1C7C4C; --paid-bg:#E7F5EC; --pend:#916411; --pend-bg:#FBF1DC; --pend-ink:#6B4A0C;
  --over:#C6362F; --over-bg:#FBE9E7; --ro-ink:#8E2620; --part:#2563A8; --part-bg:#E7F0FB; --item-ink:#1C4A80;
  --canc:#676D7B; --canc-bg:#EDEFF3;
  --ev-ink:#5C2E10; --on-brand:#FFFFFF; --seg-on:var(--navy); --seg-on-ink:#FFFFFF; --toast-bg:var(--navy); --toast-ink:#FFFFFF; --switch-on:var(--brand);
  --scrim:rgba(18,22,34,.45); --inc:#1baf7a; --exp:#eb6834;
  --sel-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%235B6472' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  color-scheme:light;
}
:root[data-mode="dark"],[data-theme="film"][data-mode="dark"]{
  --paper:#1A1512;
  --surface:#241E1A;
  --surface-2:#2C2520;
  --ink:#F1E8E0;
  --muted:#A8998D;
  --faint:#968B83;
  --border:#352B24;
  --border-strong:#4A3D34; --field-border:#7B6F66;
  --navy:#110D0B;
  --navy-2:#221B17;
  --navy-act:#3A2E26;
  --side-ink:#E9DED4;
  --side-ink-2:#A8998D;
  --brand:#E08A52;
  --brand-2:#F2A877;
  --brand-bg:#3D2A1E;
  --today-bg:#211A16;
  --auth-glow:#2E221B;
  --focus:rgba(224,138,82,.28);
  --link:#6CB4F0;
  --paid:#6BD39A; --paid-bg:#18301F; --pend:#E8B962; --pend-bg:#3A2E17; --pend-ink:#E8B962;
  --over:#F4837A; --over-bg:#3B1D1B; --ro-ink:#F4837A; --part:#7FB2F0; --part-bg:#1A2A40; --item-ink:#A9CBF5;
  --canc:#A3A9B3; --canc-bg:#2A2D33;
  --ev-ink:var(--brand-2); --seg-on:var(--ink); --seg-on-ink:var(--paper); --toast-bg:var(--ink); --toast-ink:var(--paper); --switch-on:var(--brand);
  --scrim:rgba(0,0,0,.6); --inc:#3CC98F; --exp:#F08A5D;
  --sel-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23A3A3A0' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  color-scheme:dark;
  --on-brand:#1A1512;
}
[data-theme="darkroom"]{
  --paper:#F3F1F0;
  --surface:#FFFFFF;
  --surface-2:#F9F7F7;
  --ink:#171313;
  --muted:#6A605E;
  --faint:#736A69;
  --border:#E7E2E1;
  --border-strong:#D3CBCA; --field-border:#8E8685;
  --navy:#171313;
  --navy-2:#2A1E1D;
  --navy-act:#3A2524;
  --side-ink:#E8DEDC;
  --side-ink-2:#B8AAA7;
  --brand:#B3261E;
  --brand-2:#8E1D17;
  --brand-bg:#F8E4E1;
  --today-bg:#FFF8F7;
  --auth-glow:#F6DEDB;
  --focus:rgba(179,38,30,.18);
  --link:#2271B9;
  --paid:#1C7C4C; --paid-bg:#E7F5EC; --pend:#916411; --pend-bg:#FBF1DC; --pend-ink:#6B4A0C;
  --over:#C6362F; --over-bg:#FBE9E7; --ro-ink:#8E2620; --part:#2563A8; --part-bg:#E7F0FB; --item-ink:#1C4A80;
  --canc:#676D7B; --canc-bg:#EDEFF3;
  --ev-ink:#5C2E10; --on-brand:#FFFFFF; --seg-on:var(--navy); --seg-on-ink:#FFFFFF; --toast-bg:var(--navy); --toast-ink:#FFFFFF; --switch-on:var(--brand);
  --scrim:rgba(18,22,34,.45); --inc:#1baf7a; --exp:#eb6834;
  --sel-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%235B6472' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  color-scheme:light;
}
[data-theme="darkroom"][data-mode="dark"]{
  --paper:#151111;
  --surface:#1F1919;
  --surface-2:#261F1F;
  --ink:#F2EAE8;
  --muted:#A89996;
  --faint:#918785;
  --border:#322727;
  --border-strong:#473938; --field-border:#776B69;
  --navy:#0C0909;
  --navy-2:#1E1515;
  --navy-act:#3A2524;
  --side-ink:#E8DEDC;
  --side-ink-2:#A89996;
  --brand:#E0483D;
  --brand-2:#F38379;
  --brand-bg:#3E1D1A;
  --today-bg:#1C1515;
  --auth-glow:#2A1715;
  --focus:rgba(224,72,61,.28);
  --link:#6CB4F0;
  --paid:#6BD39A; --paid-bg:#18301F; --pend:#E8B962; --pend-bg:#3A2E17; --pend-ink:#E8B962;
  --over:#F4837A; --over-bg:#3B1D1B; --ro-ink:#F4837A; --part:#7FB2F0; --part-bg:#1A2A40; --item-ink:#A9CBF5;
  --canc:#A3A9B3; --canc-bg:#2A2D33;
  --ev-ink:var(--brand-2); --seg-on:var(--ink); --seg-on-ink:var(--paper); --toast-bg:var(--ink); --toast-ink:var(--paper); --switch-on:var(--brand);
  --scrim:rgba(0,0,0,.6); --inc:#3CC98F; --exp:#F08A5D;
  --sel-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23A3A3A0' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  color-scheme:dark;
  --on-brand:#150E0E;
}
[data-theme="lens"]{
  --paper:#EEF3F3;
  --surface:#FFFFFF;
  --surface-2:#F6F9F9;
  --ink:#0F2328;
  --muted:#55686C;
  --faint:#627073;
  --border:#DDE7E8;
  --border-strong:#C8D6D8; --field-border:#7E8C8F;
  --navy:#0F2328;
  --navy-2:#183238;
  --navy-act:#1F3E45;
  --side-ink:#D6E6E8;
  --side-ink-2:#9DB5B9;
  --brand:#1F6F78;
  --brand-2:#17565D;
  --brand-bg:#DDEEEF;
  --today-bg:#F5FBFB;
  --auth-glow:#D6ECEE;
  --focus:rgba(31,111,120,.2);
  --link:#2271B9;
  --paid:#1C7C4C; --paid-bg:#E7F5EC; --pend:#916411; --pend-bg:#FBF1DC; --pend-ink:#6B4A0C;
  --over:#C6362F; --over-bg:#FBE9E7; --ro-ink:#8E2620; --part:#2563A8; --part-bg:#E7F0FB; --item-ink:#1C4A80;
  --canc:#676D7B; --canc-bg:#EDEFF3;
  --ev-ink:#5C2E10; --on-brand:#FFFFFF; --seg-on:var(--navy); --seg-on-ink:#FFFFFF; --toast-bg:var(--navy); --toast-ink:#FFFFFF; --switch-on:var(--brand);
  --scrim:rgba(18,22,34,.45); --inc:#1baf7a; --exp:#eb6834;
  --sel-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%235B6472' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  color-scheme:light;
}
[data-theme="lens"][data-mode="dark"]{
  --paper:#0E1C1F;
  --surface:#15272B;
  --surface-2:#1A2F34;
  --ink:#E6F0F1;
  --muted:#94A9AD;
  --faint:#849699;
  --border:#22393E;
  --border-strong:#314C52; --field-border:#667A7E;
  --navy:#081316;
  --navy-2:#12262A;
  --navy-act:#1F3E45;
  --side-ink:#D6E6E8;
  --side-ink-2:#94A9AD;
  --brand:#5FB7C0;
  --brand-2:#8FD3DA;
  --brand-bg:#183C42;
  --today-bg:#122428;
  --auth-glow:#132E33;
  --focus:rgba(95,183,192,.28);
  --link:#6CB4F0;
  --paid:#6BD39A; --paid-bg:#18301F; --pend:#E8B962; --pend-bg:#3A2E17; --pend-ink:#E8B962;
  --over:#F4837A; --over-bg:#3B1D1B; --ro-ink:#F4837A; --part:#7FB2F0; --part-bg:#1A2A40; --item-ink:#A9CBF5;
  --canc:#A3A9B3; --canc-bg:#2A2D33;
  --ev-ink:var(--brand-2); --seg-on:var(--ink); --seg-on-ink:var(--paper); --toast-bg:var(--ink); --toast-ink:var(--paper); --switch-on:var(--brand);
  --scrim:rgba(0,0,0,.6); --inc:#3CC98F; --exp:#F08A5D;
  --sel-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23A3A3A0' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  color-scheme:dark;
  --on-brand:#0A181B;
}
[data-theme="mono"]{
  --paper:#F2F2F0;
  --surface:#FFFFFF;
  --surface-2:#F8F8F7;
  --ink:#161616;
  --muted:#626262;
  --faint:#6D6D6D;
  --border:#E4E4E1;
  --border-strong:#D0D0CC; --field-border:#888888;
  --navy:#161616;
  --navy-2:#262626;
  --navy-act:#333333;
  --side-ink:#E6E6E6;
  --side-ink-2:#ABABAB;
  --brand:#161616;
  --brand-2:#161616;
  --brand-bg:#E6E6E3;
  --today-bg:#FAFAF8;
  --auth-glow:#E6E6E3;
  --focus:rgba(22,22,22,.18);
  --link:#2271B9;
  --paid:#1C7C4C; --paid-bg:#E7F5EC; --pend:#916411; --pend-bg:#FBF1DC; --pend-ink:#6B4A0C;
  --over:#C6362F; --over-bg:#FBE9E7; --ro-ink:#8E2620; --part:#2563A8; --part-bg:#E7F0FB; --item-ink:#1C4A80;
  --canc:#676D7B; --canc-bg:#EDEFF3;
  --ev-ink:#5C2E10; --on-brand:#FFFFFF; --seg-on:var(--navy); --seg-on-ink:#FFFFFF; --toast-bg:var(--navy); --toast-ink:#FFFFFF; --switch-on:var(--brand);
  --scrim:rgba(18,22,34,.45); --inc:#1baf7a; --exp:#eb6834;
  --sel-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%235B6472' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  color-scheme:light;
}
[data-theme="mono"][data-mode="dark"]{
  --paper:#121212;
  --surface:#1C1C1C;
  --surface-2:#232323;
  --ink:#F0F0EE;
  --muted:#A3A3A0;
  --faint:#8A8A87;
  --border:#2C2C2C;
  --border-strong:#3F3F3F; --field-border:#70706E;
  --navy:#090909;
  --navy-2:#1A1A1A;
  --navy-act:#2E2E2E;
  --side-ink:#E6E6E6;
  --side-ink-2:#A3A3A0;
  --brand:#F0F0EE;
  --brand-2:#F0F0EE;
  --brand-bg:#2E2E2E;
  --today-bg:#181818;
  --auth-glow:#1E1E1E;
  --focus:rgba(240,240,238,.22);
  --link:#6CB4F0;
  --paid:#6BD39A; --paid-bg:#18301F; --pend:#E8B962; --pend-bg:#3A2E17; --pend-ink:#E8B962;
  --over:#F4837A; --over-bg:#3B1D1B; --ro-ink:#F4837A; --part:#7FB2F0; --part-bg:#1A2A40; --item-ink:#A9CBF5;
  --canc:#A3A9B3; --canc-bg:#2A2D33;
  --ev-ink:var(--brand-2); --seg-on:var(--ink); --seg-on-ink:var(--paper); --toast-bg:var(--ink); --toast-ink:var(--paper); --switch-on:var(--brand);
  --scrim:rgba(0,0,0,.6); --inc:#3CC98F; --exp:#F08A5D;
  --sel-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23A3A3A0' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  color-scheme:dark;
  --on-brand:#121212;
  --switch-on:#7A7A78; --seg-on:#F0F0EE;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums}
button{font-family:inherit;cursor:pointer;color:inherit}
input,select,textarea{font-family:inherit;font-size:14px}
[hidden]{display:none!important}
a{color:var(--link)}

/* ── каркас ── */
.app{display:grid;grid-template-columns:232px 1fr;min-height:100vh}
.side{background:var(--navy);color:var(--side-ink);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;z-index:30}
.brand{padding:22px 18px 18px;display:flex;align-items:center;gap:11px;border-bottom:1px solid rgba(255,255,255,.08)}
.brand-mark{width:34px;height:34px;border-radius:10px;background:var(--brand);color:var(--on-brand);display:flex;align-items:center;justify-content:center;flex:0 0 34px}
.brand-mark svg{width:30px;height:30px}
.brand-t{font-weight:700;font-size:15px;color:#fff;letter-spacing:.2px;line-height:0}
/* логотип Bookeh: буквы — цвет текста, две «o» — акцент темы (в чёрно-белой — светлые, иначе пропадают на тёмной панели) */
.brand-word{display:block;height:19px;width:81px}
.brand .bk-o{color:var(--brand)}
/* в светлых режимах панель тёмная, а акцент темы рассчитан на светлый фон — берём светлый вариант акцента той же темы */
:root:not([data-mode="dark"]) .brand .bk-o{color:#E08A52}
[data-theme="darkroom"]:not([data-mode="dark"]) .brand .bk-o{color:#E0483D}
[data-theme="lens"]:not([data-mode="dark"]) .brand .bk-o{color:#5FB7C0}
[data-theme="mono"]:not([data-mode="dark"]) .brand .bk-o{color:var(--side-ink)}
/* чёрно-белая светлая: акцент #161616 сливается с тёмной панелью — знак и полоса места светлые */
[data-theme="mono"]:not([data-mode="dark"]) .brand .brand-mark{background:#F0F0EE;color:#161616}
[data-theme="mono"]:not([data-mode="dark"]) .usage .bar i{background:var(--side-ink)}
.brand-s{font-size:11px;color:var(--side-ink-2);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
.nav{padding:10px;display:flex;flex-direction:column;gap:2px;flex:1;overflow:auto}
.nav button{display:flex;align-items:center;gap:11px;width:100%;text-align:left;background:none;border:0;color:var(--side-ink);padding:9px 11px;border-radius:9px;font-size:13.5px;font-weight:500}
.nav button svg{width:18px;height:18px;flex:0 0 18px;fill:none;stroke:currentColor;stroke-width:var(--ic-sw);stroke-linecap:round;stroke-linejoin:round;opacity:.85}
.nav button:hover{background:rgba(255,255,255,.06);color:#fff}
.nav button.active{background:var(--navy-act);color:#fff}
.nav .badge{margin-left:auto;font-family:var(--mono);font-size:11px;background:rgba(255,255,255,.14);padding:1px 7px;border-radius:20px}
.nav .badge.alert{background:var(--over);color:#fff}
.side-foot{padding:12px;border-top:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;gap:8px}
.usage{font-size:11.5px;color:var(--side-ink-2)}
.usage .bar{height:5px;border-radius:5px;background:rgba(255,255,255,.12);margin-top:6px;overflow:hidden}
.usage .bar i{display:block;height:100%;background:var(--brand);border-radius:5px}
.side-foot .who{font-size:12px;color:var(--side-ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-foot button{background:rgba(255,255,255,.07);border:0;color:var(--side-ink);padding:8px;border-radius:8px;font-size:12.5px;font-weight:500}
.side-foot button:hover{background:rgba(255,255,255,.14)}
.main{min-width:0;display:flex;flex-direction:column}
.nav-scrim{display:none}
.topbar{display:none}
.content{padding:26px 30px 60px;max-width:1280px;width:100%}
.page-h{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.page-h h1{margin:0;font-size:24px;font-weight:700;letter-spacing:-.2px}
.page-h .sub{color:var(--muted);font-size:13px;margin-top:3px}
.page-h .acts{display:flex;gap:8px;flex-wrap:wrap}

/* ── баннер подписки ── */
.plan-banner{display:flex;align-items:center;gap:14px;padding:11px 30px;font-size:13px;border-bottom:1px solid var(--border);flex-wrap:wrap}
.plan-banner.trial{background:var(--brand-bg);color:var(--brand-2)}
.plan-banner.ro{background:var(--over-bg);color:var(--ro-ink)}
.plan-banner b{font-weight:600}
.plan-banner .btn{margin-left:auto}

/* ── элементы ── */
.btn{border:1px solid var(--border-strong);background:var(--surface);color:var(--ink);padding:8px 14px;border-radius:9px;font-size:13px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:7px;transition:background .15s,border-color .15s,color .15s;white-space:nowrap}
.btn:hover{border-color:var(--navy-2)}
.btn.primary{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}
.btn.primary:hover{background:var(--brand-2);border-color:var(--brand-2)}
.btn.ghost{background:none;border-color:transparent;color:var(--muted)}
.btn.ghost:hover{background:var(--surface-2);color:var(--ink)}
.btn{min-height:36px}
.btn.sm{padding:4px 10px;font-size:12px;border-radius:8px;min-height:30px}
.btn.danger{color:var(--over)}
.btn:disabled{opacity:.55;cursor:default}
.btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:var(--ic-sw);stroke-linecap:round}
.iconbtn{background:none;border:0;width:32px;height:32px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;color:var(--muted);font-size:16px}
.iconbtn:hover{background:var(--surface-2);color:var(--ink)}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}
.card-h{display:flex;align-items:center;justify-content:space-between;padding:14px 18px 10px;gap:10px}
.card-h h3{margin:0;font-size:14px;font-weight:600}
.card-b{padding:4px 18px 16px}
.muted{color:var(--muted)} .faint{color:var(--faint)} .small{font-size:12.5px}
.empty{padding:36px 18px;text-align:center;color:var(--muted);font-size:13.5px;line-height:1.55;max-width:520px;margin:0 auto}
.empty::before{content:'';display:block;width:96px;height:68px;margin:0 auto 18px;border-radius:8px;background:
  linear-gradient(145deg,var(--brand-bg) 0%,var(--surface) 100%);border:1px solid var(--border-strong);
  box-shadow:6px -6px 0 -1px var(--surface),6px -6px 0 0 var(--border),12px -12px 0 -1px var(--surface),12px -12px 0 0 var(--border);position:relative;left:-6px;top:6px}
.empty.inline::before{display:none}
.empty .btn{margin-top:12px}
.grid{display:grid;gap:16px}
.grid.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.kpi{padding:16px 18px}
.kpi .l{font-size:12px;color:var(--muted);font-weight:600}
.kpi .v{font-size:22px;font-weight:700;margin-top:4px;font-variant-numeric:tabular-nums;letter-spacing:-.3px}
.kpi .s{font-size:12px;color:var(--muted);margin-top:2px}

.pill{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:2px 9px;border-radius:20px;white-space:nowrap;background:var(--canc-bg);color:var(--canc)}
.pill.paid,.pill.ok{background:var(--paid-bg);color:var(--paid)}
.pill.pend{background:var(--pend-bg);color:var(--pend)}
.pill.over{background:var(--over-bg);color:var(--over)}
.pill.part{background:var(--part-bg);color:var(--part)}
.pill.brand{background:var(--brand-bg);color:var(--brand-2)}

table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;font-size:11.5px;font-weight:600;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--border);white-space:nowrap}
td{padding:11px 12px;border-bottom:1px solid var(--border);vertical-align:middle}
tr:last-child td{border-bottom:0}
tbody tr.click{cursor:pointer} tbody tr.click:hover td{background:var(--surface-2)}
td.r,th.r{text-align:right}
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tbl-wrap table{min-width:720px}
td.num,td.r{white-space:nowrap}
a.btn{text-decoration:none}

.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.seg{display:inline-flex;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:3px;gap:2px}
.seg button{border:0;background:none;padding:6px 12px;border-radius:7px;font-size:12.5px;font-weight:600;color:var(--muted)}
.seg button.on{background:var(--seg-on);color:var(--seg-on-ink)}
.seg .seg-cur{display:inline-flex;align-items:center;padding:6px 12px;border-radius:7px;font-size:12.5px;font-weight:600;background:var(--seg-on);color:var(--seg-on-ink)}   /* 0.8.7 (UI086-12): текущее значение — текстом, не выключенной кнопкой */
.search{display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--field-border);border-radius:10px;padding:0 12px;min-width:240px;flex:0 1 320px;min-height:36px}
.search input{border:0;outline:0;background:none;padding:9px 0;width:100%}
.search svg{width:15px;height:15px;stroke:var(--faint);fill:none;stroke-width:var(--ic-sw)}

/* ── поля ── */
.field{margin-bottom:14px;min-width:0}
.field label{display:block;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--field-border);   /* 0.8.7 (UI086-13): граница поля — не ниже 3:1 к фону */
  border-radius:9px;padding:10px 12px;background:var(--surface-2);color:var(--ink);transition:border-color .15s,box-shadow .15s,background .15s;min-height:42px}
.field textarea{resize:vertical;min-height:72px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--brand);background:var(--surface);box-shadow:0 0 0 3px var(--focus)}
.field select{-webkit-appearance:none;appearance:none;padding-right:36px;background-image:var(--sel-arrow);background-repeat:no-repeat;background-position:right 13px center;background-size:12px 8px}
.field .hint{font-size:12px;color:var(--faint);margin-top:5px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field-row.c3{grid-template-columns:1fr 1fr 1fr}
.check{display:flex;align-items:center;gap:9px;font-size:13.5px;cursor:pointer}
.check input{width:17px;height:17px;accent-color:var(--brand);flex:0 0 17px;min-height:0!important}
.field label.check{display:flex;font-size:13.5px;font-weight:500;color:var(--ink);margin:0}
.sect{font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);margin:22px 0 10px}
.sect:first-child{margin-top:0}
#order-files>.sect:first-child,#order-mail>.sect:first-child,#order-gallery>.sect:first-child{margin-top:22px}   /* блоки карточки заказа идут после кнопок оплат — отступ нужен */
.err{color:var(--over);font-size:13px;margin-top:8px;min-height:0}
.err:empty{display:none}

/* ── окно ── */
.scrim{position:fixed;inset:0;background:var(--scrim);display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;z-index:100;overflow:auto}
.modal{background:var(--surface);border-radius:16px;width:100%;max-width:600px;box-shadow:0 24px 60px rgba(20,24,34,.3);display:flex;flex-direction:column;max-height:calc(100vh - 80px)}
.modal.wide{max-width:780px}
.modal-head{padding:16px 22px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:10px}
.modal-head h3{margin:0;font-size:16px;font-weight:600;min-width:0;overflow-wrap:anywhere}   /* 0.8.7 (UI086-04): длинное имя без пробелов не выталкивает крестик */
.modal-head>.iconbtn,.modal-head>[data-close]{flex:0 0 auto}
.modal-body{padding:20px 22px;overflow:auto;flex:1 1 auto}
.modal-foot{padding:12px 22px;border-top:1px solid var(--border);display:flex;align-items:center;gap:8px}
.modal-foot .sp{flex:1}
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);background:var(--toast-bg);color:var(--toast-ink);padding:10px 18px;border-radius:10px;font-size:13px;opacity:0;transition:opacity .2s,transform .2s;z-index:200;pointer-events:none;max-width:calc(100vw - 32px)}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.bad{background:var(--over)}

/* ── вход и онбординг ── */
.auth{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 16px;background:radial-gradient(1200px 600px at 10% -10%,var(--auth-glow) 0,transparent 60%),var(--paper)}
.auth-card{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:32px;width:100%;max-width:460px;box-shadow:0 10px 40px rgba(20,24,34,.06)}
.auth-card.wide{max-width:720px}
.auth-brand{display:flex;align-items:center;gap:10px;margin-bottom:22px}
.auth-brand .brand-mark{width:32px;height:32px;flex-basis:32px}
.auth-brand .brand-word{height:24px;width:102px;color:var(--ink)}
.auth-brand .bk-o{color:var(--brand)}
.auth-card h1{font-size:22px;margin:0 0 6px;letter-spacing:-.2px}
.auth-card .lead{color:var(--muted);margin:0 0 22px}
.auth-card .btn.primary{width:100%;min-height:44px;font-size:14px}
.auth-alt{margin-top:16px;text-align:center;font-size:13px;color:var(--muted)}
.auth-alt button{background:none;border:0;color:var(--brand-2);font-weight:600;padding:0}
.steps{display:flex;gap:6px;margin-bottom:20px}
.steps i{flex:1;height:4px;border-radius:4px;background:var(--border)}
.steps i.on{background:var(--brand)}
.steps-l{font-size:12px;color:var(--muted);margin:-12px 0 18px}
.prof-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:20px}
.prof-grid .prof:last-child:nth-child(odd){grid-column:1/-1}   /* пятая профессия — во всю ширину, без дыры справа */
.prof{border:1.5px solid var(--border);background:var(--surface);border-radius:14px;padding:18px 16px;text-align:left;display:flex;flex-direction:column;gap:8px;transition:border-color .15s,background .15s}
.prof:hover{border-color:var(--border-strong);background:var(--surface-2)}
.prof.on{border-color:var(--brand);background:var(--brand-bg)}
.prof svg{width:28px;height:28px;fill:none;stroke:var(--brand-2);stroke-width:var(--ic-sw);stroke-linecap:round;stroke-linejoin:round}
.prof b{font-size:15px}
.prof span{font-size:12.5px;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.chip{border:1.5px solid var(--border-strong);background:var(--surface);border-radius:20px;padding:7px 14px;font-size:13px;font-weight:500;display:inline-flex;align-items:center;gap:6px}
.chip.on{border-color:var(--brand);background:var(--brand-bg);color:var(--brand-2)}
.chip.on::before{content:'✓';font-weight:700}
.demo-box{background:var(--surface-2);border:1px solid var(--border);border-radius:12px;padding:16px 18px;margin:4px 0 20px}
.demo-box ul{margin:8px 0 0;padding-left:18px;color:var(--muted)}
.demo-box li{margin:3px 0}

/* 0.13.0: подтверждение телефона */
.auth-or{display:flex;align-items:center;gap:10px;margin:18px 0 14px;color:var(--muted);font-size:12.5px}
.auth-or::before,.auth-or::after{content:"";flex:1;height:1px;background:var(--border)}
#ph-tg .btn.primary{width:100%}
/* ── календарь ── */
.cal{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.cal-in{min-width:0}
.cal{--cal-h:54px}
.cal-row{display:grid}
.cal-hd{border-bottom:1px solid var(--border);padding:9px 6px;text-align:center;font-size:12px;color:var(--muted);font-weight:600;border-left:1px solid var(--border)}
.cal-hd:first-child{border-left:0}
.cal-hd b{display:block;font-size:18px;color:var(--ink);font-weight:700;margin-top:1px}
.cal-hd.today b{color:var(--on-brand);background:var(--brand);border-radius:50%;width:32px;height:32px;line-height:32px;margin:1px auto 0}
.cal-ad{border-bottom:1px solid var(--border);border-left:1px solid var(--border);min-height:30px;padding:3px;display:flex;flex-direction:column;gap:3px;background:var(--surface-2)}
.cal-ad.lbl{font-size:10.5px;color:var(--faint);padding:8px 6px;text-align:right;border-left:0}
.cal-dl{font-size:11px;border-radius:5px;padding:2px 6px;background:var(--pend-bg);color:var(--pend);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:0;text-align:left;font-weight:600;width:100%}
.cal-dl.over{background:var(--over-bg);color:var(--over)}
.cal-scroll{max-height:calc(100vh - 250px);min-height:360px;overflow-y:auto}
.cal-hours div{height:48px;font-size:10.5px;color:var(--faint);text-align:right;padding-right:7px;position:relative;top:-7px}
.cal-hours div:first-child{visibility:hidden}
.cal-col{position:relative;border-left:1px solid var(--border);background:repeating-linear-gradient(to bottom,transparent 0,transparent 47px,var(--border) 47px,var(--border) 48px);cursor:copy}
.cal-col.today{background-color:var(--today-bg)}
.cal-ev{display:flex;flex-direction:column;justify-content:flex-start;position:absolute;left:3px;right:3px;border-radius:7px;padding:4px 7px;font-size:11.5px;line-height:1.3;overflow:hidden;border:0;text-align:left;border-left:3px solid var(--brand);background:var(--brand-bg);color:var(--ev-ink);z-index:1}
.cal-ev b{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-ev span{opacity:.8;white-space:nowrap}
.cal-ev.item{border-left-color:var(--part);background:var(--part-bg);color:var(--item-ink)}
.cal-ev.inquiry{border-left-style:dashed;opacity:.85}
.cal-ev.canceled{border-left-color:var(--canc);background:var(--canc-bg);color:var(--canc);text-decoration:line-through}
.cal-ev:hover{filter:brightness(.97);z-index:2}
.cal-now{position:absolute;left:0;right:0;height:2px;background:var(--over);z-index:2}
.cal-now::before{content:'';position:absolute;left:-4px;top:-3px;width:8px;height:8px;border-radius:50%;background:var(--over)}


/* ── календарь: месяц ── */
.cal-month{--cm-line:var(--border)}
.cal-nav{display:inline-flex;gap:8px;flex-wrap:nowrap}
.cm-head{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-bottom:1px solid var(--border);background:var(--surface-2)}
.cm-head div{padding:8px 6px;text-align:center;font-size:12px;font-weight:600;color:var(--muted)}
.cm-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.cm-cell{border-left:1px solid var(--cm-line);border-top:1px solid var(--cm-line);padding:4px;display:flex;flex-direction:column;gap:2px;min-width:0;cursor:pointer}
.cm-cell:nth-child(7n+1){border-left:0}
.cm-cell:nth-child(-n+7){border-top:0}
.cm-cell.out{background:var(--surface-2)}
.cm-cell.out .cm-num{color:var(--faint)}
.cm-cell.today{background:var(--today-bg)}
.cm-cell:hover{filter:brightness(.98)}
.cm-num{align-self:flex-start;border:0;background:none;font-size:12.5px;font-weight:700;color:var(--ink);min-width:24px;height:24px;border-radius:12px;padding:0 6px}
.cm-cell.today .cm-num{background:var(--brand);color:var(--on-brand)}
.cm-ev{display:block;width:100%;border:0;border-left:3px solid var(--brand);background:var(--brand-bg);color:var(--ev-ink);border-radius:5px;padding:2px 5px;font-size:11px;line-height:1.35;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cm-ev i{font-style:normal;font-weight:700;opacity:.92}
.cm-ev.item{border-left-color:var(--part);background:var(--part-bg);color:var(--item-ink)}
.cm-ev.inquiry{border-left-style:dashed}
.cm-ev.canceled{border-left-color:var(--canc);background:var(--canc-bg);color:var(--canc);text-decoration:line-through}
.cm-ev.dl{border-left-color:var(--pend);background:var(--pend-bg);color:var(--pend);font-weight:600}
.cm-more{border:0;background:none;color:var(--muted);font-size:11px;font-weight:600;text-align:left;padding:1px 4px}
.cm-more:hover{color:var(--ink);text-decoration:underline}

/* ── главная: настраиваемые блоки ── */
.dash{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;align-items:stretch}
.dw{position:relative;min-width:0;grid-column:span 3}
.dw-kpi{grid-column:span 2}
.dw.wide{grid-column:span 6}
.dw>.dw-body,.dw>.dw-body>.card{height:100%}
.dash-hint{margin:-4px 0 12px}
.dash.editing .dw{outline:2px dashed var(--border);outline-offset:3px;border-radius:var(--radius);cursor:grab;padding-top:34px}
.dash.editing .dw-body{pointer-events:none;user-select:none}
.dw-bar{position:absolute;left:0;right:0;top:0;height:34px;display:flex;align-items:center;gap:4px;padding:0 6px;font-size:12px;z-index:3}
.dw-bar b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.dw-bar .sp{flex:1}
.dw-grip{color:var(--faint);font-size:16px;padding:0 2px}
.dw-bar button{white-space:nowrap;border:1px solid var(--border);background:var(--surface);color:var(--ink);border-radius:7px;font-size:11.5px;font-weight:600;padding:3px 8px;min-height:26px}
.dw-bar button:disabled{opacity:.35}
.dw-bar button[aria-pressed=true]{background:var(--brand-bg);border-color:var(--brand);color:var(--ink)}
.dw.dragging{opacity:.4}
.dw.drop-before::before,.dw.drop-after::after{content:'';position:absolute;top:0;bottom:0;width:4px;border-radius:2px;background:var(--brand);z-index:4}
.dw.drop-before::before{left:-10px}
.dw.drop-after::after{right:-10px}
.dw.wide.drop-before::before,.dw.wide.drop-after::after,.dw.y.drop-before::before,.dw.y.drop-after::after{top:auto;bottom:auto;left:0;right:0;width:auto;height:4px}
.dw.wide.drop-before::before,.dw.y.drop-before::before{top:-10px}
.dw.wide.drop-after::after,.dw.y.drop-after::after{bottom:-10px}
.dash-tray{margin-top:16px}
.dash-tray .card-b{display:flex;flex-wrap:wrap;gap:8px}
@media (max-width:640px){
  .dash{gap:8px}
  .dw{grid-column:span 6}.dw-kpi{grid-column:span 2}
  .dash:not(.editing) .dw-kpi .kpi{padding:10px 10px}.dash:not(.editing) .dw-kpi .kpi .v{font-size:17px}.dash:not(.editing) .dw-kpi .kpi .l,.dash:not(.editing) .dw-kpi .kpi .s{font-size:11px}
  .dash.editing .dw-kpi{grid-column:span 6}
  .dw-bar button{min-height:36px}
  .cm-cell{padding:2px;min-height:76px}.cm-ev{font-size:10px;padding:1px 3px;border-left-width:2px}.cm-ev i{display:none}
  .page-h .acts .seg{order:-1}
}

/* ── заказ: карточка ── */
.kv{display:grid;grid-template-columns:150px 1fr;gap:8px 14px;font-size:13.5px}
.kv dt{color:var(--muted)} .kv dd{margin:0;min-width:0;overflow-wrap:anywhere}
.stages{display:flex;gap:4px;flex-wrap:wrap;margin:6px 0 4px}
.stage{font-size:11.5px;padding:5px 10px;border-radius:7px;border:1px solid var(--border);background:var(--surface);color:var(--muted);font-weight:600}
.stage.done{background:var(--paid-bg);color:var(--paid);border-color:transparent}
.stage.cur{background:var(--brand);color:var(--on-brand);border-color:var(--brand)}
.money-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border);font-size:13px}
.money-row:last-child{border-bottom:0}
.money-row .what{flex:1;min-width:0;overflow-wrap:anywhere}
.money-row .amt{font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:600}
.totals{display:flex;gap:18px;flex-wrap:wrap;padding:12px 14px;background:var(--surface-2);border-radius:10px;margin-top:10px;font-size:13px}
.totals b{font-family:var(--mono)}
.team-row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 100px auto 32px;gap:8px;margin-bottom:8px;align-items:center}
.team-row input:not([type=checkbox]),.team-row select{width:100%;border:1px solid var(--field-border);border-radius:8px;padding:8px 10px;background:var(--surface-2);min-height:38px;font-size:13px}
.team-row:has(input[data-tf=name]:not([hidden])){grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) 100px auto 32px}
/* 0.10.1: сотрудник — состав команды без гонораров */
@media(min-width:721px){.team-row.nofee{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 32px}.team-row.nofee:has(input[data-tf=name]:not([hidden])){grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) 32px}}
.team-bill{font-size:12.5px;white-space:nowrap}

/* ── тарифы ── */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;max-width:1100px}
/* 0.12.0: дополнительные места к тарифу */
.plan-seats{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;font-size:13.5px}
.plan-seats small{display:block;color:var(--muted);font-size:12px}
.plan-seats .stepper{display:flex;align-items:center;gap:6px}
.plan-seats .stepper b{min-width:22px;text-align:center;font-family:var(--mono)}
.plan-seats .iconbtn{border:1px solid var(--field-border);border-radius:8px;width:32px;height:32px;font-size:18px;line-height:1}
.plan-seats .iconbtn:disabled{opacity:.35}
.plan{padding:22px;display:flex;flex-direction:column;gap:10px;position:relative}
.plan.cur{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
.plan h3{margin:0;font-size:18px}
.plan .price{font-size:30px;font-weight:700;letter-spacing:-.5px;font-family:var(--mono)}
.plan .price small{font-size:13px;color:var(--muted);font-family:var(--sans);font-weight:500;letter-spacing:0}
.plan ul{margin:0;padding-left:18px;color:var(--muted);font-size:13.5px}
.plan li{margin:4px 0}
.plan .btn{margin-top:auto}
.plan .tag{position:absolute;top:16px;right:16px}

/* 0.15.0: автопродление */
.bill-auto{max-width:1100px;margin-bottom:16px}
.bill-auto .card-b{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 18px}
.bill-auto-note{max-width:1100px;margin:0 0 16px}
.plan-btns{display:grid;gap:6px;margin-top:auto}
.plan-btns .btn{margin-top:0;white-space:normal;height:auto;min-height:40px;padding-top:8px;padding-bottom:8px}
.plan-auto-on{margin-top:auto;padding:10px 0;text-align:center}
/* ── адаптив ── */
@media (max-width:1000px){ .grid.c3{grid-template-columns:1fr 1fr} }
@media (max-width:820px){
  .app{grid-template-columns:1fr}
  .side{position:fixed;left:0;top:0;bottom:0;width:260px;transform:translateX(-100%);transition:transform .2s}
  body.nav-open .side{transform:none}
  body.nav-open .nav-scrim{display:block;position:fixed;inset:0;background:var(--scrim);z-index:25}
  .topbar{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:20}
  .topbar b{font-size:15px}
  .content{padding:18px 16px 50px}
  .plan-banner{padding:10px 16px}
  .grid.c3,.grid.c2,.plans{grid-template-columns:1fr}
  .field-row,.field-row.c3{grid-template-columns:1fr}
  .prof-grid{grid-template-columns:1fr}
  .kv{grid-template-columns:1fr;gap:2px 0} .kv dd{margin-bottom:8px}
  .auth-card{padding:24px 20px}
  .cal{--cal-h:44px}
  .team-row,.team-row:has(input[data-tf=name]:not([hidden])){grid-template-columns:1fr 1fr}
  .scrim{padding:0} .modal{max-height:100vh;border-radius:0;min-height:100vh}
  .search{min-width:0;flex:1 1 100%}
}

.note-box{margin-top:12px;padding:11px 14px;border-radius:10px;background:var(--surface-2);border:1px solid var(--border);font-size:12.5px;color:var(--muted);line-height:1.5}
.note-box b{color:var(--ink)}
/* ── финансы ── */
.fin-chart{position:relative}
.fin-legend{display:flex;gap:14px;font-size:12px;color:var(--muted)}
.fin-legend i,.fin-tip i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.fin-tip{position:absolute;z-index:5;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 24px rgba(20,24,34,.12);padding:9px 12px;font-size:12.5px;min-width:160px;pointer-events:none}
.fin-tip div{display:flex;align-items:center;gap:4px;margin-top:3px;color:var(--muted)} .fin-tip .num{margin-left:auto;color:var(--ink);padding-left:12px}
.fin-bar{margin:9px 0}
.fin-bar-l{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;margin-bottom:4px} .fin-bar-l .num{color:var(--muted);white-space:nowrap}
.fin-bar-t{height:6px;border-radius:6px;background:var(--surface-2);overflow:hidden} .fin-bar-t i{display:block;height:100%;border-radius:6px}

.dt-field{display:flex;align-items:center;gap:6px}
.dt-field input[type=date]{flex:1 1 auto;min-width:0}
.field .dt-field select{width:auto;flex:0 0 auto;padding-right:30px;background-position:right 10px center}
.dt-colon{font-weight:600;color:var(--muted)}
/* ── настройки: строки как в Licensia ── */
.set-list{display:flex;flex-direction:column;gap:22px;max-width:680px}
.set-gh{margin:0 0 7px 4px;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted)}
.set-box{background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden}
.set-row{display:flex;align-items:center;gap:12px;width:100%;min-height:58px;padding:11px 14px;background:none;border:0;border-radius:0;color:inherit;font:inherit;text-align:left;position:relative}
.set-box>*+*{box-shadow:inset 0 1px 0 var(--border)}
button.set-row{cursor:pointer;transition:background .12s}
button.set-row:hover{background:var(--surface-2)}
button.set-row:focus-visible{outline:2px solid var(--link);outline-offset:-2px}
.set-ico{flex:0 0 32px;height:32px;border-radius:8px;background:var(--surface-2);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--ink)}
.set-ico svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:var(--ic-sw);stroke-linecap:round;stroke-linejoin:round;opacity:.78}
.set-info{flex:1 1 auto;min-width:0;display:flex;flex-direction:column}
.set-t{font-weight:600;font-size:14px;color:var(--ink);overflow-wrap:break-word}
.set-s{font-size:12.5px;color:var(--muted);margin-top:1px;overflow-wrap:break-word}
.set-note{font-size:12px;color:var(--muted);margin-top:3px}
.set-msg{font-size:12px;color:var(--muted)} .set-msg:not(:empty){margin-top:4px}
.set-end{flex:0 0 auto;display:flex;align-items:center;gap:8px;margin-left:auto;max-width:45%}
.set-val{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
.set-chev{width:16px;height:16px;flex:0 0 16px;fill:none;stroke:var(--muted);stroke-width:var(--ic-sw);stroke-linecap:round;stroke-linejoin:round;opacity:.7}
.set-link{min-height:44px;color:var(--link);font-weight:600;font-size:13px}
.set-switch{position:relative;flex:0 0 42px;width:42px;height:24px;border-radius:12px;border:0;padding:0;background:var(--border-strong);cursor:pointer;transition:background .15s}
.set-switch span{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .15s}
.set-switch[aria-checked="true"]{background:var(--switch-on)}
.set-switch[aria-checked="true"] span{transform:translateX(18px)}
.set-switch:focus-visible{outline:2px solid var(--link);outline-offset:2px}
.set-switch:disabled{opacity:.5;cursor:default}
.set-pick{cursor:pointer;transition:background .12s;min-height:52px} .set-pick:hover{background:var(--surface-2)}
.set-pick-head{display:flex;align-items:center;gap:12px;justify-content:space-between;margin-bottom:12px}
.set-link-btn{background:none;border:0;padding:6px 0;color:var(--link);font:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.set-selwrap{position:relative;display:inline-flex;max-width:100%;min-width:0}
.set-selwrap::after{content:'';position:absolute;right:10px;top:50%;width:6px;height:6px;border-right:1.6px solid var(--muted);border-bottom:1.6px solid var(--muted);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.set-select{appearance:none;-webkit-appearance:none;border:1px solid var(--field-border);background:var(--surface-2);color:var(--ink);font:inherit;font-size:13px;font-weight:600;padding:6px 28px 6px 11px;border-radius:8px;cursor:pointer;max-width:100%;min-width:0;text-overflow:ellipsis}
.set-select:hover{border-color:var(--border-strong)}
button.set-row:disabled{cursor:default;opacity:.6} button.set-row:disabled:hover{background:none}
.set-list{max-width:720px}
@media (max-width:820px){
  .set-end{max-width:45%}
  .btn.sm,.seg button,.stage{min-height:36px} .seg{max-width:100%;overflow-x:auto;scrollbar-width:none} .seg button{white-space:nowrap}
  #menu-btn{width:44px;height:44px} .set-switch{flex-basis:46px;width:46px;height:26px} .set-switch[aria-checked="true"] span{transform:translateX(20px)}
  .plan-banner{flex-wrap:wrap;gap:6px 10px;padding:8px 14px;font-size:12.5px;line-height:1.4} .plan-banner span{flex:1 1 220px;min-width:0} .plan-banner .btn{flex:0 0 auto}   /* 0.7.5 (N04): причина и следующий шаг — целиком, не «…» */
}
@media (max-width:600px){ .set-row{flex-wrap:wrap} .set-info{flex-basis:calc(100% - 44px)} .set-end{max-width:calc(100% - 44px);min-width:0;margin-left:44px} .set-end .set-select{max-width:100%} button.set-row .set-end{margin-left:auto;max-width:45%} }
.team-row select{-webkit-appearance:none;appearance:none;padding-right:30px;background-image:var(--sel-arrow);background-repeat:no-repeat;background-position:right 11px center;background-size:11px 7px;cursor:pointer}

/* выбор темы */
.theme-pick{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;background:none;border:0;text-align:left;font:inherit;color:inherit;cursor:pointer}
.theme-pick:hover{background:var(--surface-2)}
.theme-sw{display:flex;flex:0 0 auto;border-radius:9px;overflow:hidden;box-shadow:0 0 0 1px var(--border)}
.theme-sw i{width:18px;height:36px;display:block}
.theme-pick .set-end svg{width:20px;height:20px;fill:none;stroke:var(--brand);stroke-width:var(--ic-sw);stroke-linecap:round;stroke-linejoin:round}
.mode-seg{display:flex;width:100%} .mode-seg button{flex:1 1 0;min-height:38px}

/* 0.11.0: участники кабинета */
.tm-seats{margin-bottom:4px}
.tm-row{gap:8px;align-items:center}
.tm-row .set-select{min-width:150px}
.tm-form{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) auto;gap:10px;align-items:end}
.tm-form .field{margin:0}
.tm-form .btn{height:42px}
#tm-hint{margin-top:8px}
.tm-link{margin:14px 0 4px}
.tm-link>div{margin-top:4px}
.tm-copy{display:flex;gap:8px;margin-top:10px}
.tm-copy input{flex:1;min-width:0;border:1px solid var(--field-border);border-radius:8px;padding:8px 10px;background:var(--surface);color:var(--ink);font-size:12.5px}
.tm-cab{width:100%;text-align:left;border:1px solid var(--border);border-radius:10px;margin-bottom:8px}
.tm-cab[aria-current=true]{border-color:var(--ink)}
.brand-s.pick{cursor:pointer;text-decoration:underline dotted;text-underline-offset:3px}
@media(max-width:720px){.tm-form{grid-template-columns:1fr}.tm-row{flex-wrap:wrap}}

/* 0.17.0: поле «имя.домен» в окне «Адрес галерей» */
.sub-in{display:flex;align-items:center;gap:8px}
.sub-in input{flex:1 1 auto;min-width:0}
.sub-in span{flex:none;color:var(--muted);font-family:var(--mono);font-size:13px;white-space:nowrap}
/* ── галереи ── */
.gd-selbar .sp,.gde-fbar .sp{flex:1}
.gal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.gal-card{display:flex;flex-direction:column;text-align:left;padding:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;cursor:pointer;transition:border-color .12s,box-shadow .12s}
.gal-card:hover,.gal-item:hover .gal-card{border-color:var(--border-strong);box-shadow:0 12px 28px rgba(0,0,0,.1);transform:translateY(-2px)}
.gal-card{transition:border-color .15s,box-shadow .2s,transform .2s}
.gal-cov img{transition:transform .35s ease}
.gal-card:hover .gal-cov img,.gal-item:hover .gal-cov img{transform:scale(1.04)}
.gal-cov{overflow:hidden}
.gal-card:focus-visible{outline:2px solid var(--link);outline-offset:2px}
.gal-cov{aspect-ratio:4/3;background:var(--surface-2);display:flex;align-items:center;justify-content:center;color:var(--faint)}
.gal-cov img{width:100%;height:100%;object-fit:cover;display:block}
.gal-cov svg,.gal-meta svg,.gph-b svg,.gd-drop svg,.gpk .pill svg{fill:none;stroke:currentColor;stroke-width:var(--ic-sw);stroke-linecap:round;stroke-linejoin:round}
.gal-cov svg{width:40px;height:40px}
.gal-ci{display:flex;flex-direction:column;gap:4px;padding:12px 14px 14px}
.gal-ci b{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gal-meta{display:flex;gap:14px;color:var(--muted);font-size:12.5px;font-variant-numeric:tabular-nums;margin-top:2px}
.gal-meta span{display:inline-flex;align-items:center;gap:4px} .gal-meta svg{width:15px;height:15px}
.gal-pills{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:var(--ic-sw);stroke-linecap:round;stroke-linejoin:round}
.gd-phead{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;padding-top:12px;margin-bottom:12px}
.gd-phead .chips{margin:0;flex:1 1 360px}
.gd-pacts{display:flex;gap:8px;margin-left:auto;flex-wrap:wrap}
.gd-add{border-style:dashed}
.gd-add svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:var(--ic-sw)}
#gd-body.gd-over{outline:2px dashed var(--brand);outline-offset:6px;border-radius:var(--radius)}
.gd-drop{width:100%;display:flex;flex-direction:column;align-items:center;gap:8px;padding:48px 20px;border:1.5px dashed var(--border-strong);border-radius:12px;background:var(--surface-2);color:var(--ink);font:inherit;cursor:pointer;text-align:center}
.gd-drop svg{width:34px;height:34px;color:var(--brand)}
.gd-drop:hover{border-color:var(--brand)}
.gd-prog{display:flex;flex-direction:column;gap:6px;padding:10px 12px;margin-bottom:12px;border-radius:10px;background:var(--brand-bg);font-size:13px}
.gd-prog .bar{height:6px;border-radius:6px;background:var(--surface);overflow:hidden} .gd-prog .bar i{display:block;height:100%;background:var(--brand);transition:width .2s}
.gd-prog-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .gd-prog-h .sp{flex:1} .gd-prog-s{color:var(--muted);font-variant-numeric:tabular-nums} .gd-prog-off{color:var(--over);font-weight:500}
@media (prefers-reduced-motion:reduce){.gd-prog .bar i{transition:none}}
.gd-selbar{position:sticky;top:8px;z-index:4;display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 10px;margin-bottom:12px;border-radius:10px;background:var(--navy);color:var(--side-ink)}
.gd-selbar .btn{background:var(--surface);color:var(--ink)}
.gd-selbar .set-select{min-height:32px}
.gph-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.gph{position:relative;border-radius:8px;overflow:hidden;background:var(--surface-2);cursor:pointer;border:0;padding:0;display:block}
.gph img{display:block;width:100%;height:150px;object-fit:cover;user-select:none}
.gph-pick .gph img{height:140px}
.gph:hover img{opacity:.92}
.gph.sel{box-shadow:0 0 0 3px var(--brand)}
.gph.drag{opacity:.4} .gph.drop{box-shadow:0 0 0 3px var(--link)}
.gph-badges{position:absolute;left:6px;top:6px;display:flex;gap:4px}
.gph-b{width:24px;height:24px;border-radius:12px;background:rgba(20,20,20,.55);color:#fff;display:flex;align-items:center;justify-content:center}
.gph-b svg{width:14px;height:14px}
.gph-check{position:absolute;right:6px;top:6px;width:22px;height:22px;border-radius:11px;border:2px solid #fff;background:rgba(0,0,0,.2);opacity:0;transition:opacity .12s}
.gph:hover .gph-check,.gph.sel .gph-check,.gph-check:focus-visible,.gph:focus-within .gph-check{opacity:1}
.gph-check{padding:0;cursor:pointer;min-height:0}
.gph-check:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.gph.sel .gph-check{background:var(--brand);border-color:var(--brand);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 12.5 4 4 8-8.5' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-size:16px;background-position:center;background-repeat:no-repeat}
.gph-name{position:absolute;left:0;right:0;bottom:0;padding:16px 8px 6px;font-size:11px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.55));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transition:opacity .12s}
.gph:hover .gph-name{opacity:1}
/* оформление */
.gde{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap}
.gde-panel{flex:0 0 380px;max-width:100%;overflow:hidden}
.gde-h{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:56px;padding:0 18px;background:none;border:0;border-top:1px solid var(--border);font:inherit;font-size:15px;font-weight:600;color:var(--ink);text-align:left}
.gde-h:first-child{border-top:0}
.gde-h:hover{background:var(--surface-2)}
.gde-h[aria-expanded="true"] .set-chev{transform:rotate(90deg)}
.gde-h .set-chev{transition:transform .15s}
.gde-b{padding:0 18px 18px;display:flex;flex-direction:column;gap:12px}
.gde-b .sect{margin:6px 0 0}
.gde-row{display:flex;gap:8px;flex-wrap:wrap}
.gde-focus{position:relative;align-self:center;padding:0;border:0;background:none;cursor:crosshair;line-height:0;border-radius:8px;overflow:hidden;max-width:100%}
.gde-focus img{max-width:100%;max-height:320px;display:block;user-select:none}
.gde-dot{position:absolute;width:28px;height:28px;margin:-14px 0 0 -14px;border-radius:14px;border:3px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.45),inset 0 0 0 1px rgba(0,0,0,.3);pointer-events:none}
.gde-grid2,.gde-grid3,.gde-grid4{display:grid;gap:8px}
.gde-grid2{grid-template-columns:repeat(2,minmax(0,1fr))} .gde-grid3{grid-template-columns:repeat(3,minmax(0,1fr))} .gde-grid4{grid-template-columns:repeat(4,minmax(0,1fr))}
.gde-t{min-height:48px;padding:8px;border-radius:10px;border:1px solid var(--border);background:var(--surface);color:var(--ink);font:inherit;font-size:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center}
.gde-t:hover{border-color:var(--border-strong)}
.gde-t.on{box-shadow:0 0 0 2px var(--ink);border-color:var(--ink)}
.gde-sw{width:30px;height:30px;border-radius:15px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.gde-mini{position:relative;width:100%;height:84px;border-radius:6px;overflow:hidden;background:#F2EFEA;display:block}
.gde-mini img{display:block;object-fit:cover}
.gde-mini em{position:absolute;height:4px;width:40%;left:30%;border-radius:2px;background:#141414}
.gde-m-full img{width:100%;height:100%} .gde-m-full em{background:#fff;bottom:12px}
.gde-m-frame img{width:30%;height:58%;margin:8px auto 0} .gde-m-frame em{bottom:10px}
.gde-m-split img{width:50%;height:100%} .gde-m-split em{left:58%;width:30%;top:40px}
.gde-m-top img{width:100%;height:62%;position:absolute;bottom:0} .gde-m-top em{top:10px}
.gde-m-inset img{position:absolute;inset:8px;width:calc(100% - 16px);height:calc(100% - 16px)} .gde-m-inset em{background:#fff;top:40px}
.gde-m-poster img{width:38%;height:76%;margin:8px auto 0} .gde-m-poster em{background:#fff;width:28%;left:36%;top:50px;height:6px}
.gde-prev{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;align-items:center;gap:12px;position:sticky;top:12px}
.gde-frame{position:relative;overflow:hidden;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.14)}
.gde-frame.desktop{width:100%;height:min(780px,calc(100vh - 160px));border-radius:12px;border:1px solid var(--border)}
.gde-frame.phone{width:390px;max-width:100%;height:min(800px,calc(100vh - 150px));border-radius:42px;border:10px solid var(--navy);box-shadow:0 0 0 1px var(--border-strong),0 10px 30px rgba(0,0,0,.14)}
.gde-scroll{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain}
.gde-full{position:fixed;inset:0;z-index:200;background:#000;display:flex;flex-direction:column}
.gde-fbar{display:flex;align-items:center;gap:10px;height:52px;padding:0 14px;background:var(--navy);color:var(--side-ink);flex:0 0 52px}
.gde-fscroll{flex:1 1 auto;overflow-y:auto;position:relative}
/* выбор клиента */
.gpk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.gpk{display:flex;flex-direction:column;gap:8px}
.gpk img{width:100%;height:180px;object-fit:cover;border-radius:8px;display:block}
.gpk-i{display:flex;flex-direction:column;gap:5px;font-size:12.5px;align-items:flex-start}
.gpk-i b{word-break:break-all}
.gpk .pill svg{width:12px;height:12px}
.gpk-c{background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:7px 9px;color:var(--ink);white-space:pre-wrap}
@media (max-width:1180px){ .gde{flex-direction:column} .gde-panel{flex-basis:auto;width:100%} .gde-prev{position:static;width:100%} .gde-frame.desktop{height:min(640px,70vh)} }
@media (max-width:820px){ .gph-grid{grid-template-columns:repeat(auto-fill,minmax(105px,1fr))} .gph img{height:110px} .gd-tabs{overflow-x:auto;max-width:100%;scrollbar-width:none} .gd-tabs button{white-space:nowrap} }

/* заказы карточками вместо таблицы — когда таблица не помещается в свою колонку (0.8.1: по ширине самой колонки,
   а не экрана: на ноутбуке 1100–1200 px с боковым меню таблица раньше уезжала вправо, «Оплата» и «Сумма» прятались) */
.olist{display:none}
.tbl-wrap:has(> .olist){container-type:inline-size}
@container (max-width:940px){
  .tbl-wrap:has(> .olist) table{display:none}
  .olist{display:flex;flex-direction:column}
  .orow{display:flex;flex-direction:column;align-items:flex-start;gap:3px;width:100%;padding:12px 16px;background:none;border:0;border-bottom:1px solid var(--border);text-align:left;font:inherit;color:inherit;cursor:pointer}
  .orow:last-child{border-bottom:0}
  .orow b{font-size:14.5px}
  .orow-when{font-size:12px;color:var(--muted)}
  .orow-pills{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:5px;width:100%}
  .orow-sum{margin-left:auto;font-weight:600}
}

/* 0.4.1 — часовой пояс просмотра */
.tz-switch{display:flex;align-items:center;gap:8px;position:relative;font-size:12.5px;cursor:pointer}
.tz-switch>span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.tz-switch svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:var(--ic-sw);stroke-linecap:round;stroke-linejoin:round;flex:0 0 15px}
.tz-switch select{flex:1;min-width:0;height:30px;border-radius:8px;font:inherit;font-weight:600;padding:0 26px 0 9px;cursor:pointer}
.tz-switch.in-side{color:var(--side-ink-2)}
.tz-switch.in-side select{background-color:rgba(255,255,255,.07);border:0;color:var(--side-ink);background-position:right 8px center}
.tz-switch.in-side select:hover{background-color:rgba(255,255,255,.14)}
.tz-switch.in-side option,.tz-switch.in-side optgroup{color:#141414;background:#fff}
.tz-switch.cal-tz{color:var(--muted);margin-right:4px}
.tz-switch.cal-tz select{height:36px;border:1px solid var(--border);background-color:var(--surface);color:var(--ink);max-width:190px}
@media (max-width:640px){.tz-switch.cal-tz{width:100%;order:-1;margin:0 0 4px}.tz-switch.cal-tz select{max-width:none}}
[data-tz-hint]:empty{display:none}
.tz-switch select{-webkit-appearance:none;appearance:none;background-image:var(--sel-arrow);background-repeat:no-repeat;background-position:right 9px center;background-size:10px 7px;text-overflow:ellipsis}

/* 0.4.5 — переключатели шире экрана: затухание справа подсказывает, что вкладки листаются */
.seg.seg-scroll{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);scroll-behavior:smooth}
.seg.seg-scroll.seg-end{-webkit-mask-image:none;mask-image:none}
/* 0.4.5 — iPhone/Android: зоны нажатия не меньше ~40 px (палец, не курсор) */
.modal-head .iconbtn{flex:0 0 auto}
@media (pointer:coarse){
  .iconbtn{width:40px;height:40px;font-size:18px}
  .modal-head{padding:10px 12px 10px 18px}
  .auth-alt button{padding:11px 8px;margin:-6px 0;min-height:40px}
  .side-foot button{min-height:42px;font-size:14px}
  .tz-switch select{height:38px}
}

/* 0.4.6 — быстрые действия на карточке галереи (опубликовать, ссылка, удалить) */
.gal-item{position:relative;display:flex;flex-direction:column}
.gal-item>.gal-card{flex:1}
.gal-acts{position:absolute;top:10px;right:10px;z-index:2;display:flex;gap:6px}
.gal-act{width:36px;height:36px;border-radius:50%;border:0;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;
  background:rgba(255,255,255,.94);color:#2A211C;box-shadow:0 2px 8px rgba(0,0,0,.18);transition:transform .12s,background .12s,color .12s}
.gal-act svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:var(--ic-sw);stroke-linecap:round;stroke-linejoin:round}
.gal-act:hover{transform:scale(1.07);background:#fff}
.gal-act.danger:hover{color:#B42F28}
.gal-act:focus-visible{outline:2px solid var(--link);outline-offset:2px}
@media (pointer:coarse){.gal-act{width:40px;height:40px}}

/* 0.4.7 — iOS Safari: поле 16px не вызывает зум; высота окна — без адресной строки */
@media (pointer:coarse){ input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px} .field .dt-field select{font-size:16px} }
@supports (height:100dvh){ .side{height:100dvh} @media (max-width:640px){ .modal{max-height:100dvh;min-height:100dvh} } }

/* 0.4.8: строки таблиц доступны с клавиатуры */
tr.click:focus-visible,.money-row:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}

/* ── UI-компоненты 0.6.0 (app-src/05a-ui.js) ── */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* поиск: у поля не было видимого фокуса (outline:0) — рамка всего поля, как у полей форм */
.search:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--focus)}
.seg button:focus-visible{outline:2px solid var(--link);outline-offset:1px}
/* «Показать ещё»: раньше — класс .empty с картинкой пустого списка над кнопкой */
.more-row{padding:14px;text-align:center;border-top:1px solid var(--border)}
/* загрузка раздела: строки-заглушки */
.skel{display:grid;gap:10px;padding:6px 0 10px}
.skel-row{height:14px;border-radius:6px;background:linear-gradient(90deg,var(--surface-2) 0%,var(--border) 50%,var(--surface-2) 100%);background-size:200% 100%;animation:skel 1.4s ease-in-out infinite}
@keyframes skel{0%{background-position:100% 0}100%{background-position:-100% 0}}
.ui-sect-err{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:4px 0 10px}
.ui-sect-err .err{margin:0}
/* занятая кнопка (busy): остаётся в фокусе, но не нажимается повторно; крутилка вместо текста не прячет подпись */
.btn.is-busy,.btn[aria-disabled="true"]{cursor:progress;opacity:.75}
.btn.is-busy::after{content:'';width:12px;height:12px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:spin .7s linear infinite;flex:none}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.skel-row,.btn.is-busy::after{animation:none}}
/* водяной знак (0.6.4): редактор — настройки слева, предпросмотр справа; на телефоне — друг под другом */
.wm-ed{display:flex;gap:20px;align-items:flex-start}
.wm-ctl{flex:0 0 280px;min-width:0}
.wm-ctl .seg{display:flex;flex-wrap:wrap}
.wm-ctl input[type=range]{width:100%}
.wm-file{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.wm-prev{flex:1 1 auto;min-width:0;display:flex;justify-content:center;align-items:center;background:var(--surface-2);border:1px solid var(--border);border-radius:12px;padding:10px;position:sticky;top:0}
.wm-prev canvas{max-width:100%;height:auto;max-height:60vh;border-radius:6px;display:block}
.wm-chip{display:inline-flex;align-items:center;justify-content:center;width:56px;height:28px;border-radius:6px;background:linear-gradient(135deg,#8a8f98,#3b3f46);overflow:hidden;vertical-align:middle}
.wm-chip img{max-width:48px;max-height:22px;object-fit:contain}
@media (max-width:720px){ .wm-ed{flex-direction:column-reverse} .wm-ctl{flex-basis:auto;width:100%} .wm-prev{position:static;width:100%} }
.note-box.warn{background:var(--pend-bg);border-color:var(--pend);color:var(--pend-ink)}

/* ── быстрая запись с телефона (0.7.1): экран одной записи ── */
@media (max-width:820px){ .page-h .acts [data-new-order]{display:none} }   /* «Записать» — в нижнем меню (0.7.3) */
.qb-modal .modal-head{padding:12px 16px}
.qb-modal .modal-body{padding:16px}
.qb-modal .modal-foot{padding:10px 16px calc(10px + env(safe-area-inset-bottom))}
.qb{display:flex;flex-direction:column;gap:20px}
.qb-sec{display:flex;flex-direction:column;gap:10px;min-width:0}
.qb-h{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted)}
.qb-h .small{text-transform:none;letter-spacing:0;font-weight:500}
.qb-link{display:inline-flex;align-items:center;min-height:44px;background:none;border:0;padding:0;color:var(--brand-2);font-weight:600;font-size:13.5px;text-transform:none;letter-spacing:0;cursor:pointer}
.qb-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.qb-modal input:not([type=radio]):not([type=checkbox]),.qb-modal select,.qb-modal textarea{width:100%;border:1px solid var(--field-border);border-radius:11px;padding:11px 12px;background:var(--surface-2);color:var(--ink);min-height:50px;font:inherit;font-size:16px;transition:border-color .15s,box-shadow .15s,background .15s}
.qb-modal textarea{min-height:70px;resize:vertical;line-height:1.4}
.qb-modal select{-webkit-appearance:none;appearance:none;padding-right:30px;background-image:var(--sel-arrow);background-repeat:no-repeat;background-position:right 11px center;background-size:12px 8px}
.qb-modal input:focus,.qb-modal select:focus,.qb-modal textarea:focus{outline:none;border-color:var(--brand);background:var(--surface);box-shadow:0 0 0 3px var(--focus)}
.qb-f{display:flex;flex-direction:column;gap:5px;min-width:0}
.qb-f>span:first-child{font-size:12px;font-weight:600;color:var(--muted)}
.qb-money{display:flex;gap:6px}.qb-money input{flex:1;min-width:0}.qb-money select{flex:0 0 74px;width:74px}
.qb-chips,.qb-src{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.qb-src{gap:6px}
.qb-scroll{flex-wrap:nowrap;overflow-x:auto;margin:0 -16px;padding:2px 16px 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.qb-scroll::-webkit-scrollbar{display:none}
.qb-scroll>*{flex:0 0 auto}
.qb-src[hidden]{display:none}
.qb-chip{position:relative;display:inline-flex}
.qb-chip input,.qb-day input[type=radio],.qb-seg input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.qb-chip span{display:inline-flex;align-items:center;min-height:42px;padding:0 15px;border-radius:21px;border:1px solid var(--border-strong);background:var(--surface);font-weight:600;font-size:14px;color:var(--ink)}
.qb-chip.sm span{min-height:34px;padding:0 12px;border-radius:17px;font-size:13px;font-weight:500}
.qb-chip input:checked+span{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}
.qb-chip input:focus-visible+span,.qb-seg input:focus-visible+span{outline:2px solid var(--link);outline-offset:2px}
.qb-days{display:flex;gap:6px;overflow-x:auto;margin:0 -16px;padding:2px 16px 6px;scroll-snap-type:x proximity;scroll-padding-inline:16px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.qb-days::-webkit-scrollbar{display:none}
.qb-day{position:relative;flex:0 0 58px;display:flex;flex-direction:column;align-items:center;padding:8px 0 7px;border:1px solid var(--border-strong);border-radius:13px;background:var(--surface);scroll-snap-align:start;cursor:pointer;color:var(--ink)}
.qb-day .w{font-size:var(--qbw-fs,11px);font-weight:600;color:var(--muted);white-space:nowrap;max-width:54px;overflow:hidden;text-overflow:ellipsis}
.qb-day .d{font-size:20px;font-weight:700;line-height:1.2}
.qb-day .m{font-size:10.5px;color:var(--faint);line-height:1.1}
.qb-day i{font-style:normal;min-width:17px;height:17px;padding:0 4px;border-radius:9px;font-size:10.5px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:4px}
.qb-day.busy i{background:var(--brand-bg);color:var(--brand-2)}
.qb-day:has(input:checked){background:var(--brand);border-color:var(--brand);color:var(--on-brand)}
.qb-day:has(input:checked) .w,.qb-day:has(input:checked) .m{color:inherit;opacity:.85}
.qb-day.busy:has(input:checked) i{background:var(--on-brand);color:var(--brand)}
.qb-day:has(input:focus-visible){outline:2px solid var(--link);outline-offset:2px}
.qb-other{border-style:dashed}
.qb-modal .qb-other input[type=date]{position:absolute;inset:0;width:100%;height:100%;min-height:0;opacity:0;border:0;padding:0;margin:0;cursor:pointer}
.qb-dayinfo{display:flex;flex-direction:column;gap:5px}
.qb-dayinfo:empty{display:none}
.qb-ev{display:flex;align-items:center;gap:8px;font-size:13px;padding:8px 10px;border-radius:10px;background:var(--surface-2)}
.qb-ev .tm{font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--muted);flex:0 0 auto}
.qb-ev .tt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qb-ev.hit{background:var(--over-bg);color:var(--over)}.qb-ev.hit .tm{color:inherit}
.qb-free{font-size:12.5px;color:var(--faint)}
.qb-seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;padding:3px;border-radius:12px;background:var(--surface-2);border:1px solid var(--border)}
.qb-seg label{position:relative;display:flex}
.qb-seg span{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;min-height:42px;padding:0 4px;border-radius:9px;font-size:13px;font-weight:600;color:var(--muted);line-height:1.15}
.qb-seg input:checked+span{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(20,24,34,.14)}
.qb-sugg{display:flex;flex-direction:column;gap:6px}.qb-sugg:empty{display:none}
.qb-s{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:8px 10px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--ink);font:inherit;min-height:52px}
button.qb-s{cursor:pointer}
.qb-s .av{flex:0 0 34px;height:34px;border-radius:17px;background:var(--brand-bg);color:var(--brand-2);display:flex;align-items:center;justify-content:center;font-weight:700}
.qb-s .t{display:flex;flex-direction:column;min-width:0}
.qb-s .t b,.qb-s .t .small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qb-pick{display:flex;align-items:center;gap:6px}.qb-pick .qb-s{flex:1;border-color:var(--brand)}
.qb-pick .iconbtn{width:44px;height:44px;flex:0 0 44px}
.qb-paid{margin-top:-2px}
.qb-more summary{cursor:pointer;font-weight:600;font-size:14px;color:var(--brand-2);min-height:44px;display:flex;align-items:center;list-style:none}
.qb-more summary::-webkit-details-marker{display:none}
.qb-more summary::before{content:'+ '}.qb-more[open] summary::before{content:'− '}
.qb-more[open]{display:flex;flex-direction:column;gap:8px}
.qb-full{align-self:flex-start;margin-top:-10px;text-align:left}
.qb-foot{display:flex;flex-direction:column;gap:8px;width:100%}
.qb-sum{display:flex;flex-direction:column;font-size:13px;line-height:1.35;min-height:36px;justify-content:center;min-width:0}
.qb-sum b{font-size:15px}.qb-sum span{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qb-go{width:100%;min-height:52px;font-size:16px;border-radius:13px}
.qb-done{display:flex;flex-direction:column;gap:14px}
.qb-ok{width:56px;height:56px;border-radius:28px;background:var(--paid-bg);color:var(--paid);display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700;align-self:center}
.qb-card{padding:14px;border-radius:13px;background:var(--surface-2);display:flex;flex-direction:column;gap:3px;font-size:14px}
.qb-card b{font-size:16px}
.qb-share{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.qb-share>:last-child:nth-child(odd){grid-column:span 2}
#qb-wa{background:#25D366;border-color:#25D366;color:#fff}
.qb-share .btn,.qb-next .btn{min-height:48px;font-size:14px;text-decoration:none}

/* ── меню, шапка и кнопки на телефоне (0.7.2) ── */
.side-x{display:none}
.nav-g{font-size:10.5px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:var(--side-ink-2);opacity:.75;padding:14px 11px 5px}
.nav-g:first-child{padding-top:4px}
.side-acc{display:flex;align-items:center;gap:8px}
.side-acc .who{flex:1;min-width:0}
.side-foot .side-acc button{flex:0 0 auto;padding:7px 12px}
.usage[data-nav]{cursor:pointer;border-radius:8px}
.usage[data-nav]:hover{color:var(--side-ink)}
.back-link{display:inline-flex;align-items:center;min-height:32px;margin-bottom:4px;text-decoration:none;font-weight:600}
@media (max-width:820px){
  /* шапка: бургер 44×44, название раздела одно — крупный дубль в странице скрыт */
  .topbar{min-height:56px;padding:env(safe-area-inset-top) 12px 0 6px;gap:6px}
  #menu-btn{width:44px;height:44px;border-radius:12px;color:var(--ink)}
  #menu-btn svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:var(--ic-sw);stroke-linecap:round}
  #menu-btn:active{background:var(--surface-2)}
  .topbar b{font-size:17px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .page-h{align-items:center;gap:10px 12px;margin-bottom:14px}
  .page-h h1.dup{display:none}
  .page-h>div:first-child{min-width:0;flex:1 1 150px}            /* подпись сжимается — главная кнопка раздела остаётся справа */
  .page-h .sub{margin-top:0}
  .page-h h1:not(.dup){font-size:22px}
  /* меню: шире, строки 48 px, группы, крестик, свайп; страница под ним не прокручивается */
  .side{width:min(86vw,340px);padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);transition:transform .24s cubic-bezier(.2,.8,.2,1),box-shadow .24s;overscroll-behavior:contain}
  body.nav-open{overflow:hidden}
  body.nav-open .side{box-shadow:16px 0 44px rgba(0,0,0,.3)}
  .nav-scrim{display:block;position:fixed;inset:0;background:var(--scrim);z-index:25;opacity:0;pointer-events:none;transition:opacity .2s}
  body.nav-open .nav-scrim{opacity:1;pointer-events:auto}
  .side .brand{padding:10px 8px 10px 18px;min-height:64px}
  .brand-txt{min-width:0;flex:1}
  .brand-s{max-width:none;font-size:12px}
  .side-x{display:inline-flex;flex:0 0 44px;width:44px;height:44px;border-radius:12px;color:var(--side-ink-2)}
  .side-x svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:var(--ic-sw);stroke-linecap:round}
  .side-x:active{background:rgba(255,255,255,.08)}
  .nav{padding:6px 10px 10px;gap:2px;overscroll-behavior:contain}
  .nav-g{padding:16px 14px 6px;font-size:11px}
  .nav button{min-height:48px;padding:0 14px;gap:14px;border-radius:12px;font-size:15.5px}
  .nav button svg{width:21px;height:21px;flex-basis:21px}
  .nav .badge{font-size:12px;padding:2px 8px}
  .side-foot{padding:12px 14px 14px;gap:10px}
  .tz-switch.in-side select{height:44px;font-size:14px}
  .usage{font-size:12.5px;padding:2px 0}
  .side-acc .who{font-size:12.5px}
  .side-foot .side-acc button{min-height:40px;padding:0 14px;font-size:13.5px}
  /* кнопки и переключатели: одна высота, переключатели разделов — во всю ширину */
  .page-h .acts .btn,.toolbar .btn,.card-h .btn{min-height:40px}
  .page-h .acts>.seg,.toolbar>.seg{flex:1 1 100%;display:flex}
  .page-h .acts>.seg button,.toolbar>.seg button{flex:1 1 0;min-height:34px;white-space:nowrap}
  .seg button{min-height:32px}
  .back-link{min-height:44px;margin:-8px 0 0}
  /* календарь: режим — первой строкой, «‹ Сегодня ›» и «Другое событие» — второй, пояс — тихой третьей */
  .page-h .acts:has(.cal-nav){width:100%}
  .page-h .acts .cal-nav{display:flex;gap:6px;order:1}
  .page-h .acts #cw-item{order:2;margin-left:auto}
  .page-h .acts .cal-nav .btn{min-width:44px}
  .tz-switch.cal-tz{order:3;width:100%;margin:0}
  .tz-switch.cal-tz select{height:38px;max-width:none}
  /* окна: крестик 44 px, нижние кнопки — во всю ширину, 46 px */
  .modal-head{padding:8px 8px 8px 16px;min-height:56px}
  .modal-head .iconbtn{width:44px;height:44px;font-size:18px;flex:0 0 44px}
  .modal-foot{padding:10px 16px calc(10px + env(safe-area-inset-bottom));flex-wrap:wrap;gap:8px}
  .modal-foot .sp{display:none}
  .modal-foot>.btn{flex:1 1 0;min-height:46px;font-size:14.5px}
  .modal-foot>.btn.ghost,.modal-foot>.btn[style*="--over"]:not(.primary){flex:0 0 auto}
  /* списки: строка таблицы — карточкой (клиенты, подрядчики, студии, операции) вместо обрезанной справа таблицы */
  .tbl-wrap table.mstack{min-width:0;display:block}
  table.mstack thead{display:none}
  table.mstack tbody{display:block}
  table.mstack tr{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 12px;padding:12px 14px;border-bottom:1px solid var(--border)}
  table.mstack tr:last-child{border-bottom:0}
  table.mstack td{display:block;padding:0;border:0;font-size:12.5px;color:var(--muted);text-align:left!important;white-space:normal}
  table.mstack td:first-child{flex:1 0 100%;font-size:14.5px;color:var(--ink)}
  table.mstack td[data-l]::before{content:attr(data-l) ' ';color:var(--faint)}
  table.mstack td:empty,table.mstack td:has(>.faint:only-child){display:none}
  table.mstack td .pill{font-size:11px}
  table.mstack td.num{font-family:inherit;font-variant-numeric:tabular-nums}
  table.mstack.fin-ops tr{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"lbl amt" "sub date";gap:2px 12px}
  table.mstack.fin-ops td:nth-child(1){grid-area:date;flex:none;font-size:12px;color:var(--faint);text-align:right!important}
  table.mstack.fin-ops td:nth-child(2){grid-area:lbl;font-size:14px;color:var(--ink)}
  table.mstack.fin-ops td:nth-child(3){grid-area:sub;display:block!important}
  table.mstack.fin-ops td:nth-child(4){grid-area:amt;font-size:14px;font-weight:600;color:var(--ink);text-align:right!important}
}

/* ── нижнее меню телефона (0.7.3): Главная · Календарь · «Записать» · Заказы · Ещё ── */
.tabbar,.more,.more-scrim{display:none}
@media (max-width:820px){
  #menu-btn{display:none}
  .topbar{padding-left:16px}
  .tabbar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--surface);border-top:1px solid var(--border);padding:6px 4px calc(6px + env(safe-area-inset-bottom));box-shadow:0 -6px 20px rgba(20,24,34,.06)}
  body.kb-open .tabbar{display:none}
  /* 0.8.7 (UI086-01): элемент в фокусе не прячется под нижним меню и верхней полосой */
  html{scroll-padding-top:calc(64px + env(safe-area-inset-top));scroll-padding-bottom:calc(84px + env(safe-area-inset-bottom))}
  .tb{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:52px;min-width:0;border:0;background:none;color:var(--muted);font:inherit;font-size:11px;font-weight:600;padding:2px 0;border-radius:12px;cursor:pointer}
  .tb>span{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .tb svg{width:25px;height:25px;flex:0 0 25px;fill:none;stroke:currentColor;stroke-width:var(--ic-sw);stroke-linecap:round;stroke-linejoin:round}
  .tb.on{color:var(--brand-2)}
  .tb.on svg{stroke-width:var(--ic-sw)}
  .tb:focus-visible{outline:2px solid var(--link);outline-offset:-2px}   /* 0.8.7 (UI086-03): тень 22 % была почти не видна */
  .tb-bd{position:absolute;top:1px;left:calc(50% + 5px);min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--over);color:#fff;font-style:normal;font-size:10.5px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid var(--surface)}
  .tb-new{color:var(--brand-2);justify-content:flex-end}
  .tb-new .tb-plus{width:58px;height:58px;flex:0 0 58px;border-radius:29px;background:var(--brand);color:var(--on-brand);display:flex;align-items:center;justify-content:center;margin-top:-30px;box-shadow:0 6px 18px rgba(20,24,34,.25);border:4px solid var(--surface);transition:transform .12s;overflow:visible;max-width:none}
  .tb-new .tb-plus svg{width:28px;height:28px;flex-basis:28px;stroke-width:2.4}
  .tb-new:active .tb-plus{transform:scale(.94)}
  .tb-new[aria-disabled=true] .tb-plus{opacity:.45;box-shadow:none}
  .content{padding-bottom:calc(104px + env(safe-area-inset-bottom))}
  .toast{bottom:calc(88px + env(safe-area-inset-bottom))}
  /* «Ещё» — нижняя панель: остальные разделы плиткой, пояс, тариф, аккаунт */
  .more-scrim{display:block;position:fixed;inset:0;background:var(--scrim);z-index:40;opacity:0;pointer-events:none;transition:opacity .2s}
  body.more-open .more-scrim{opacity:1;pointer-events:auto}
  body.more-open{overflow:hidden}
  .more{display:block;position:fixed;left:0;right:0;bottom:0;z-index:41;max-height:88vh;overflow:auto;overscroll-behavior:contain;background:var(--surface);color:var(--ink);border-radius:20px 20px 0 0;padding:8px 16px calc(16px + env(safe-area-inset-bottom));box-shadow:0 -12px 40px rgba(0,0,0,.25);transform:translateY(105%);visibility:hidden;transition:transform .26s cubic-bezier(.2,.8,.2,1),visibility 0s .26s}
  body.more-open .more{transform:none;visibility:visible;transition:transform .26s cubic-bezier(.2,.8,.2,1),visibility 0s}
  .more-grab{width:40px;height:5px;border-radius:3px;background:var(--border-strong);margin:0 auto 6px}
  .more-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
  .more-h b{font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:var(--muted)}
  .more-h .iconbtn{width:44px;height:44px;margin-right:-10px}
  .more-h .iconbtn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:var(--ic-sw);stroke-linecap:round}
  .more-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:16px}
  .more-grid button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:84px;padding:12px 4px;border-radius:14px;border:1px solid transparent;background:var(--surface-2);color:var(--ink);font:inherit;font-size:13px;font-weight:600;cursor:pointer}
  .more-grid button svg{width:26px;height:26px;fill:none;stroke:var(--brand-2);stroke-width:var(--ic-sw);stroke-linecap:round;stroke-linejoin:round}
  .more-grid button.on{border-color:var(--brand);background:var(--brand-bg)}
  .more-grid button:focus-visible{outline:2px solid var(--link);outline-offset:2px}
  .more-grid .badge{position:absolute;top:8px;right:8px;font-style:normal;font-family:var(--mono);font-size:10.5px;background:var(--brand-bg);color:var(--brand-2);padding:1px 6px;border-radius:10px}
  .more-acc{display:flex;flex-direction:column;gap:12px;border-top:1px solid var(--border);padding-top:14px}
  .tz-switch.in-more{color:var(--muted)}
  .tz-switch.in-more select{height:44px;border:1px solid var(--border);background-color:var(--surface-2);color:var(--ink);font-size:14px}
  .more-acc .usage{font-size:12.5px;color:var(--muted)}
  .more-acc .usage .bar{height:5px;border-radius:5px;background:var(--surface-2);margin-top:6px;overflow:hidden}
  .more-acc .usage .bar i{display:block;height:100%;background:var(--brand);border-radius:5px}
  .more-acc .side-acc .who{font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .more-acc .side-acc .btn{min-height:42px}
}

/* ===== 0.7.4 — единые иконки и переносы в меню =====
   Иконки: один линейный набор (app-src/01a-icons.js), одна толщина линии и три размера по месту:
   16 px — в кнопках, ссылках и строках; 20 px — в меню и кнопках-иконках; 24 px — в нижнем меню и панели «Ещё».
   Крупные иллюстрации (пустая галерея, выбор профессии) — те же линии, только больше. */
:root{--ic-sw:1.75}
svg[viewBox="0 0 24 24"]{fill:none;stroke:currentColor;stroke-width:var(--ic-sw);stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;overflow:visible}
.btn svg,.chip svg,.seg svg,.back-link svg,.qb-link svg,.tz-switch svg,.search svg,.gal-meta svg,.set-chev,.dw-bar svg,.dw-grip svg{width:16px;height:16px;flex:0 0 16px}
.pill svg,.gpk .pill svg,.gph-b svg{width:13px;height:13px;flex:0 0 13px}
.nav button svg,.iconbtn svg,.set-ico svg,.gal-act svg,#menu-btn svg,.side-x svg,.more-h .iconbtn svg,.theme-pick .set-end svg{width:20px;height:20px;flex:0 0 20px}
.set-ico svg{opacity:.85}
.iconbtn{font-size:0}
/* ссылка «назад» и «Все поля»: иконка — у текста, на его линии */
.back-link,.qb-link{gap:4px}
.back-link svg{margin-left:-3px}
.qb-link svg{order:2}
/* редактирование главной: «⠿ Название ← →» — иконки вместо символов */
.dw-grip{display:inline-flex;align-items:center;color:var(--faint);padding:0 2px}
.dw-bar button{display:inline-flex;align-items:center;justify-content:center;min-width:30px}
.qb-ok svg{width:30px;height:30px;stroke-width:2.25}
/* выбранная метка — галочка той же линией, что и иконки (раньше символ ✓ из шрифта) */
.chip.on::before{content:'';width:14px;height:14px;flex:0 0 14px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat}
/* шапки карточек: заголовок переносится по словам, кнопки и переключатели уходят на вторую строку, а не за край */
.card-h{flex-wrap:wrap;row-gap:8px}
.card-h>h3{flex:1 1 8em;min-width:0;overflow-wrap:break-word}
.card-h>.seg{max-width:100%;overflow-x:auto;scrollbar-width:none}
/* меню и кнопки: перенос только между словами, длинное слово не рвётся посередине */
.nav button,.more-grid button,.set-t,.btn,.chip,.tb>span{overflow-wrap:normal;word-break:normal;hyphens:manual}
.nav button>span:not(.badge){min-width:0;line-height:1.25}   /* длинное название — в две строки, а не «…» */
.more-grid button{text-align:center;line-height:1.2}
/* нижний аккаунт в боковом меню: кнопка выхода той же высоты, что и выбор пояса */
.side-acc .who{min-width:0}
@media (pointer:coarse){ .side-foot .side-acc button{min-height:38px;padding:0 12px;font-size:13px} }
@media (max-width:820px){
  /* нижнее меню: подписи на одной линии у всех пяти вкладок (и у «Записать»), размер подписи общий —
     подбирается так, чтобы влезло самое длинное слово (fitTabs в 06-shell.js) */
  .tb{justify-content:flex-end;padding:0 0 4px;gap:4px;font-size:var(--tb-fs,11px)}
  .tb svg{width:24px;height:24px;flex:0 0 24px}
  .more-grid button svg{width:24px;height:24px}
  .tb-new .tb-plus svg{width:26px;height:26px;flex-basis:26px;stroke-width:2.25}
  .tb-new .tb-plus{margin-top:-28px}
  /* заголовок раздела длинный (название галереи, клиента) — во всю ширину, кнопки под ним */
  .page-h.long>div:first-child{flex-basis:100%}
  .page-h.long h1{overflow-wrap:break-word}
}
.seg button:has(>svg),.cal-nav .btn:has(>svg:only-child){display:inline-flex;align-items:center;justify-content:center}
.seg button:disabled{opacity:.42;cursor:not-allowed}

/* 0.7.5 (N01): закрытое боковое меню на телефоне — не только за краем экрана, но и вне Tab и экранного диктора
   (раньше Tab с главной уходил в невидимые пункты меню) */
@media (max-width:820px){
  .side{visibility:hidden;transition:transform .24s cubic-bezier(.2,.8,.2,1),box-shadow .24s,visibility 0s .24s}
  body.nav-open .side{visibility:visible;transition:transform .24s cubic-bezier(.2,.8,.2,1),box-shadow .24s}
}
.fin-chart:focus-visible{outline:2px solid var(--link);outline-offset:4px;border-radius:6px}

/* ===== 0.8.0 — тема «Редакция» (стиль A): бумага, чёрный, терракота; заголовки — Noto Serif Display =====
   Тема по умолчанию. Прежние темы (Плёнка, Тёмная комната, Оптика, Чёрно-белая) остаются в «Настройки → Тема».
   Всё ниже — только под [data-theme="editorial"]: остальные темы не меняются. */
[data-theme="editorial"]{
  /* 0.16.0: шесть значений сведены с сайтом (bookeh-site 0.10.0): бумага, вторая поверхность, чернила и кнопка чернилами */
  --paper:#F4EFE8; --surface:#FFFDF9; --surface-2:#ECE5DC;
  --ink:#1C1815; --muted:#6E665E; --faint:#6A6159;
  --border:#E6DED3; --border-strong:#CFC4B6; --field-border:#8E8780;
  --navy:#151210; --navy-2:#2C2622; --navy-act:#2C2622; --side-ink:#151210; --side-ink-2:#6E665E;
  --brand:#1C1815; --brand-2:#9A4A25; --brand-bg:#F1E7DB; --on-brand:#F4EFE8;
  --today-bg:#FFFCF7; --auth-glow:#F1E7DB; --focus:rgba(154,74,37,.22); --link:#9A4A25;
  --paid:#18704A; --paid-bg:#E6F2EA; --pend:#8A5E10; --pend-bg:#F8EEDB; --pend-ink:#6B4A0C;
  --over:#B8352D; --over-bg:#F8E7E4; --ro-ink:#8E2620; --part:#2563A8; --part-bg:#E7EFF9; --item-ink:#1C4A80;
  --canc:#6E665E; --canc-bg:#EEE8E0;
  --ev-ink:#5C2E10; --seg-on:#1C1815; --seg-on-ink:#F4EFE8; --toast-bg:#1C1815; --toast-ink:#F4EFE8; --switch-on:#9A4A25;
  --scrim:rgba(21,18,16,.42); --inc:#1F9E6E; --exp:#C9622F;
  --radius:6px; --display:'Noto Serif Display',Georgia,'Times New Roman',serif;
  color-scheme:light;
}
[data-theme="editorial"][data-mode="dark"]{
  --paper:#0E0C0A; --surface:#1C1815; --surface-2:#25201C;
  --ink:#F3EDE5; --muted:#ABA196; --faint:#988E83;
  --border:#302A25; --border-strong:#463E37; --field-border:#756D65;
  --navy:#0E0C0A; --navy-2:#3A332D; --navy-act:#2E2823; --side-ink:#EDE6DC; --side-ink-2:#A89E93;
  --brand:#F3EDE5; --brand-2:#E0A27E; --brand-bg:#33261E; --on-brand:#14110F;
  --today-bg:#1A1613; --auth-glow:#2A211B; --focus:rgba(224,162,126,.3); --link:#E0A27E;
  --paid:#6BD39A; --paid-bg:#18301F; --pend:#E8B962; --pend-bg:#3A2E17; --pend-ink:#E8B962;
  --over:#F4837A; --over-bg:#3B1D1B; --ro-ink:#F4837A; --part:#7FB2F0; --part-bg:#1A2A40; --item-ink:#A9CBF5;
  --canc:#A3A9B3; --canc-bg:#2A2D33;
  --ev-ink:#E0A27E; --seg-on:#F3EDE5; --seg-on-ink:#14110F; --toast-bg:#F3EDE5; --toast-ink:#14110F; --switch-on:#E0A27E;
  --scrim:rgba(0,0,0,.6); --inc:#3CC98F; --exp:#F08A5D;
  --sel-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23A3A3A0' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  color-scheme:dark;
}
/* заголовки — с засечками */
[data-theme="editorial"] .page-h h1,[data-theme="editorial"] .topbar b,[data-theme="editorial"] .modal-head h3,[data-theme="editorial"] .card-h h3,
[data-theme="editorial"] .kpi .v,[data-theme="editorial"] .auth-card h1,[data-theme="editorial"] .qb-done h2{font-family:var(--display);font-weight:500;letter-spacing:0}
[data-theme="editorial"] .page-h h1:not(.dup){font-size:32px;line-height:1.1}
[data-theme="editorial"] .modal-head h3{font-size:20px}
[data-theme="editorial"] .card-h h3{font-size:19px;line-height:1.2}
[data-theme="editorial"] .kpi .v{font-size:28px}
[data-theme="editorial"] .kpi .l{text-transform:uppercase;letter-spacing:.1em;font-size:10.5px;color:var(--muted)}
[data-theme="editorial"] .sect,[data-theme="editorial"] .nav-g,[data-theme="editorial"] .qb-h{letter-spacing:.12em}
/* карточки — без рамки и тени: тонкая черта сверху, как колонка в журнале */
[data-theme="editorial"] .card{background:transparent;border:0;border-top:1px solid var(--ink);border-radius:0;box-shadow:none}
[data-theme="editorial"] .modal .card,[data-theme="editorial"] .set-box{background:var(--surface)}
[data-theme="editorial"] .set-box{border-radius:4px}
[data-theme="editorial"] .card table{background:transparent}
@media (min-width:821px){[data-theme="editorial"] .card .tbl-wrap{background:transparent}}   /* на телефоне у .tbl-wrap — тень у края (UI086-21, QA087-20) */
/* кнопки и переключатели — «таблетки»; главная кнопка — чёрная */
[data-theme="editorial"] .btn{border-radius:999px}
[data-theme="editorial"] .btn:not(.primary){background:transparent}
[data-theme="editorial"] .btn.primary{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}
[data-theme="editorial"] .btn.primary:hover{filter:none;opacity:.88}
[data-theme="editorial"] .seg{border-radius:999px;background:transparent}
[data-theme="editorial"] .seg button,[data-theme="editorial"] .seg .seg-cur{border-radius:999px}
[data-theme="editorial"] .chip{border-width:1px}
/* статусы — контур того же цвета, прописными */
[data-theme="editorial"] .pill{background:transparent!important;box-shadow:inset 0 0 0 1px currentColor;text-transform:uppercase;letter-spacing:.07em;font-size:10px;padding:2px 8px}
[data-theme="editorial"] .pill svg{width:11px;height:11px;flex-basis:11px}
/* поля — спокойнее: без серой заливки, тонкая рамка */
[data-theme="editorial"] .field input,[data-theme="editorial"] .field select,[data-theme="editorial"] .field textarea,[data-theme="editorial"] .search{background-color:var(--surface);border-radius:6px}
[data-theme="editorial"] .field input:focus,[data-theme="editorial"] .field select:focus,[data-theme="editorial"] .field textarea:focus{border-color:var(--ink)}
[data-theme="editorial"] .modal{border-radius:10px}
[data-theme="editorial"] .modal-head{border-bottom:1px solid var(--border)}
[data-theme="editorial"] a{color:var(--link)}
/* светлое боковое меню на компьютере (в тёмном режиме — тёмное, как у остальных тем) */
[data-theme="editorial"]:not([data-mode="dark"]) .side{background:var(--paper);border-right:1px solid var(--border)}
[data-theme="editorial"]:not([data-mode="dark"]) .brand{border-bottom-color:var(--border)}
[data-theme="editorial"]:not([data-mode="dark"]) .brand-t,[data-theme="editorial"]:not([data-mode="dark"]) .brand-word{color:var(--ink)}
[data-theme="editorial"] .brand .bk-o{color:#9A4A25}
[data-theme="editorial"][data-mode="dark"] .brand .bk-o{color:#E0A27E}
[data-theme="editorial"]:not([data-mode="dark"]) .nav button:hover{background:rgba(21,18,16,.05);color:var(--ink)}
[data-theme="editorial"]:not([data-mode="dark"]) .nav button.active{background:var(--surface-2);color:var(--ink);box-shadow:inset 2px 0 0 #9A4A25}
[data-theme="editorial"]:not([data-mode="dark"]) .nav .badge{background:var(--surface-2);color:var(--ink)}
[data-theme="editorial"]:not([data-mode="dark"]) .nav .badge.alert{background:var(--over);color:#fff}
[data-theme="editorial"]:not([data-mode="dark"]) .side-foot{border-top-color:var(--border)}
[data-theme="editorial"]:not([data-mode="dark"]) .side-foot button,[data-theme="editorial"]:not([data-mode="dark"]) .tz-switch.in-side select{background-color:var(--surface-2);color:var(--ink)}
[data-theme="editorial"]:not([data-mode="dark"]) .side-foot button:hover,[data-theme="editorial"]:not([data-mode="dark"]) .tz-switch.in-side select:hover{background-color:#EAE3D9}
[data-theme="editorial"]:not([data-mode="dark"]) .usage .bar{background:var(--surface-2)}
[data-theme="editorial"]:not([data-mode="dark"]) .usage .bar i{background:#9A4A25}
[data-theme="editorial"]:not([data-mode="dark"]) .side-x{color:var(--muted)}
/* вход и регистрация — без карточки, поля с чертой снизу */
[data-theme="editorial"] .auth{background:var(--paper)}
[data-theme="editorial"] .auth-card{background:transparent;border:0;box-shadow:none}
[data-theme="editorial"] .auth-card h1{font-size:40px;line-height:1.08;margin-bottom:10px}
[data-theme="editorial"] .auth-card .lead{font-family:var(--display);font-style:italic;font-size:18px;line-height:1.4}
[data-theme="editorial"] .auth-card .field input{background:transparent;border-width:0 0 1px;border-color:var(--ink);border-radius:0;padding-left:0}
[data-theme="editorial"] .auth-card .field input:focus{box-shadow:0 1px 0 0 var(--ink)}
/* список заказов, календарь, нижнее меню */
[data-theme="editorial"] .orow{border-radius:0}
[data-theme="editorial"] .cal-col.today,[data-theme="editorial"] .cm-cell.today{background-color:var(--today-bg)}   /* 0.9.3: только цвет — у колонки недели фон ещё и часовые линии */
@media (max-width:820px){
  [data-theme="editorial"] .topbar{background:var(--paper);border-bottom:1px solid var(--border)}
  [data-theme="editorial"] .topbar b{font-size:21px;font-weight:500}
  [data-theme="editorial"] .page-h h1:not(.dup){font-size:28px}
  [data-theme="editorial"] .tabbar{background:var(--paper);box-shadow:none;border-top:1px solid var(--ink)}
  [data-theme="editorial"] .tb.on{color:var(--ink)}
  [data-theme="editorial"] .tb.on>span:not(.tb-plus){text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:4px}
  [data-theme="editorial"] .tb-new{color:var(--ink)}
  [data-theme="editorial"] .tb-new .tb-plus{box-shadow:none;border-color:var(--paper)}
  [data-theme="editorial"] .more{background:var(--paper)}
  [data-theme="editorial"] .more-grid button{background:transparent;border:1px solid var(--border)}
  [data-theme="editorial"] .more-grid button svg{stroke:var(--brand-2)}
  [data-theme="editorial"] .more-grid button.on{border-color:var(--ink);background:var(--surface-2)}
  [data-theme="editorial"] .auth-card h1{font-size:36px}
}
/* шапка и низ окна не сжимаются, когда тело длинное: длинное название заказа в три строки раньше срезалось сверху */
.modal-head,.modal-foot{flex-shrink:0}
@media (max-width:820px){
  [data-theme="editorial"] .modal-head h3{font-size:18px;line-height:1.2}
  /* быстрая запись — поля с чертой снизу, как в мокапе */
  [data-theme="editorial"] .qb-modal input:not([type=radio]):not([type=checkbox]),[data-theme="editorial"] .qb-modal select,[data-theme="editorial"] .qb-modal textarea{background-color:transparent;border-width:0 0 1px;border-color:var(--ink);border-radius:0;padding-left:2px}
  [data-theme="editorial"] .qb-modal input:focus,[data-theme="editorial"] .qb-modal select:focus,[data-theme="editorial"] .qb-modal textarea:focus{box-shadow:0 1px 0 0 var(--ink);background-color:transparent}
}
[data-theme="editorial"] .page-h .sub{margin-top:6px}

/* ===== 0.8.1 — «Редакция»: единые поля, меню и кнопки =====
   Один размер и одна форма для всего, что в одну строку: кнопки, переключатели, поиск, поля, списки, выбор пояса.
   Высота 38 px (на телефоне и сенсорном экране — 46), скругление «таблеткой», рамка --border-strong, фон --surface.
   Многострочное поле — та же рамка, скругление 16 px. Раньше рядом стояли поля 30, 33, 34, 36 и 37 px со скруглением
   6, 8 и 999 px и тремя разными рамками. */
[data-theme="editorial"]{--ctl-h:38px;--ctl-sm:32px;--ctl-bd:var(--field-border);--ctl-bg:var(--surface);--ctl-fs:14px}
@media (max-width:820px),(pointer:coarse){ [data-theme="editorial"]{--ctl-h:46px;--ctl-sm:38px} }
[data-theme="editorial"] .btn,
[data-theme="editorial"] .field input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),[data-theme="editorial"] .field select,
[data-theme="editorial"] .search,[data-theme="editorial"] .seg,[data-theme="editorial"] .set-select,[data-theme="editorial"] .tz-switch select,
[data-theme="editorial"] .team-row input:not([type=checkbox]),[data-theme="editorial"] .team-row select,
[data-theme="editorial"] .qb-modal input:not([type=radio]):not([type=checkbox]),[data-theme="editorial"] .qb-modal select,
[data-theme="editorial"] .auth-card .field input,[data-theme="editorial"] .toolbar input:not(.search input),[data-theme="editorial"] .toolbar select{
  min-height:var(--ctl-h);border:1px solid var(--ctl-bd);border-radius:999px;background-color:var(--ctl-bg);color:var(--ink);font-size:var(--ctl-fs);box-shadow:none}
[data-theme="editorial"] .field input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),[data-theme="editorial"] .field select,
[data-theme="editorial"] .set-select,[data-theme="editorial"] .tz-switch select,[data-theme="editorial"] .team-row input:not([type=checkbox]),[data-theme="editorial"] .team-row select,
[data-theme="editorial"] .qb-modal input:not([type=radio]):not([type=checkbox]),[data-theme="editorial"] .qb-modal select,[data-theme="editorial"] .auth-card .field input,
[data-theme="editorial"] .toolbar input:not(.search input),[data-theme="editorial"] .toolbar select{height:var(--ctl-h);padding-top:0;padding-bottom:0;padding-left:16px}
[data-theme="editorial"] .field input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=date]):not([type=time]):not([type=datetime-local]),
[data-theme="editorial"] .qb-modal input:not([type=radio]):not([type=checkbox]),[data-theme="editorial"] .auth-card .field input{padding-right:16px}
[data-theme="editorial"] .field textarea,[data-theme="editorial"] .qb-modal textarea{border:1px solid var(--ctl-bd);border-radius:16px;background-color:var(--ctl-bg);padding:11px 16px;font-size:var(--ctl-fs)}
/* фокус — одинаковый у всех: чёрная рамка и мягкое кольцо */
[data-theme="editorial"] .field input:focus,[data-theme="editorial"] .field select:focus,[data-theme="editorial"] .field textarea:focus,[data-theme="editorial"] .set-select:focus,
[data-theme="editorial"] .tz-switch select:focus,[data-theme="editorial"] .team-row input:focus,[data-theme="editorial"] .team-row select:focus,[data-theme="editorial"] .search:focus-within,
[data-theme="editorial"] .qb-modal input:focus,[data-theme="editorial"] .qb-modal select:focus,[data-theme="editorial"] .qb-modal textarea:focus,[data-theme="editorial"] .auth-card .field input:focus{
  border-color:var(--ink);box-shadow:0 0 0 3px var(--focus);background-color:var(--ctl-bg);outline:none}
/* кнопки: малые — своя единая высота; главная — чёрная, остальные — рамка как у полей */
[data-theme="editorial"] .btn.sm{min-height:var(--ctl-sm)}
[data-theme="editorial"] .btn:not(.primary):not(.ghost){background-color:var(--ctl-bg)}
[data-theme="editorial"] .btn.ghost{border-color:transparent;background:transparent}
[data-theme="editorial"] .btn.primary{border-color:var(--brand)}
/* переключатель: та же высота, что у поля рядом; кнопки внутри заполняют её */
[data-theme="editorial"] .seg{display:inline-flex;align-items:stretch;padding:3px;gap:2px}
[data-theme="editorial"] .seg button,[data-theme="editorial"] .seg .seg-cur{min-height:0;padding-top:0;padding-bottom:0;font-size:13px}
/* поиск: поле внутри без своей рамки */
[data-theme="editorial"] .search{padding:0 16px;gap:10px}
[data-theme="editorial"] .search input{padding:0;height:calc(var(--ctl-h) - 2px);font-size:var(--ctl-fs)}
/* выбор пояса в меню и в календаре — такой же, как остальные списки */
[data-theme="editorial"] .tz-switch select{font-weight:500;padding-right:30px;background-position:right 13px center}
[data-theme="editorial"] .tz-switch.in-side select{border:1px solid var(--ctl-bd);background-color:var(--ctl-bg);color:var(--ink)}
[data-theme="editorial"][data-mode="dark"] .tz-switch.in-side select{border-color:rgba(255,255,255,.16);background-color:rgba(255,255,255,.06);color:var(--side-ink)}
[data-theme="editorial"] .side-foot .side-acc button{min-height:var(--ctl-h);border-radius:999px;border:1px solid var(--ctl-bd);background:var(--ctl-bg);color:var(--ink);padding:0 14px}
[data-theme="editorial"][data-mode="dark"] .side-foot .side-acc button{border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:var(--side-ink)}
[data-theme="editorial"] .set-selwrap::after{right:14px}
[data-theme="editorial"] .set-select{padding-right:32px;font-weight:500}
/* метки (чипы) — той же высоты, что малые кнопки */
[data-theme="editorial"] .chip{min-height:var(--ctl-sm);border:1px solid var(--ctl-bd);background:var(--ctl-bg);padding:0 14px}
[data-theme="editorial"] .chip.on{border-color:var(--ink);background:var(--brand-bg);color:var(--ink)}
[data-theme="editorial"] .search{height:var(--ctl-h);min-height:0}
[data-theme="editorial"] .search input{height:100%;min-height:0}
[data-theme="editorial"]:not([data-mode="dark"]) .tz-switch.in-side select{background-color:var(--ctl-bg)}
[data-theme="editorial"] .search input{border:0;border-radius:0;background:none;box-shadow:none;padding:0}
[data-theme="editorial"] .tz-switch.in-side select{padding-left:12px;padding-right:26px;background-position:right 10px center}
/* быстрая запись: статус — такой же переключатель, как везде; узкий список валюты — с меньшими полями */
[data-theme="editorial"] .qb-seg{border-radius:999px;background:var(--ctl-bg);border:1px solid var(--ctl-bd);min-height:var(--ctl-h);padding:3px}
[data-theme="editorial"] .qb-seg span{border-radius:999px;min-height:calc(var(--ctl-h) - 8px)}
[data-theme="editorial"] .qb-seg input:checked+span{background:var(--seg-on);color:var(--seg-on-ink);box-shadow:none}
[data-theme="editorial"] .qb-modal select[name=currency],[data-theme="editorial"] .field select[name=currency]{padding-left:12px;padding-right:26px;background-position:right 10px center}
[data-theme="editorial"] .tz-switch.in-side select{font-size:13px}
[data-theme="editorial"] .auth-card .btn.primary{min-height:var(--ctl-h)}
/* высота кнопок — сильнее прежних правил «кнопка в шапке раздела 40 px» и «выход 42 px» */
html[data-theme="editorial"] .btn:not(.sm){min-height:var(--ctl-h)}
html[data-theme="editorial"] .btn.sm{min-height:var(--ctl-sm)}
@media (max-width:820px){
  /* на телефоне кнопки той же высоты, что поля, — с чуть меньшими боковыми полями: «‹ Сегодня ›» и «Другое событие» в одну строку */
  html[data-theme="editorial"] .btn{padding-left:12px;padding-right:12px}
  html[data-theme="editorial"] .page-h .acts .cal-nav{gap:4px}
  html[data-theme="editorial"] .page-h .acts .cal-nav .btn{min-width:var(--ctl-h);padding:0}
  html[data-theme="editorial"] .page-h .acts .cal-nav #cw-today{padding:0 14px}
}
.qb-more:not([open]) > :not(summary){display:none}   /* закрытый блок «Место и заметка» — без места под скрытыми полями */
@media (max-width:820px){ html[data-theme="editorial"] .page-h .acts:has(.cal-nav){column-gap:6px} html[data-theme="editorial"] .page-h .acts .cal-nav #cw-today{padding:0 12px} }
[data-theme="editorial"] .tz-switch.in-side>span{font-size:0;gap:0}   /* в боковом меню у пояса — только значок часов: название пояса помещается целиком */
/* оформление галереи: плитки выбора — рамка как у полей, выбранная — тонким контуром, а не толстым кольцом */
[data-theme="editorial"] .gde-t{border-color:var(--ctl-bd);border-radius:12px}
[data-theme="editorial"] .gde-t.on{box-shadow:0 0 0 1.5px var(--ink);border-color:var(--ink)}
/* 0.16.0 (стиль сайта): фокус — обводка чернилами, видна в обеих темах; поля ввода сохраняют свою рамку и подсветку */
[data-theme="editorial"] :focus-visible{outline:2px solid var(--ink);outline-offset:3px}
[data-theme="editorial"] .side :focus-visible,[data-theme="editorial"] .tabbar :focus-visible{outline-color:var(--side-ink)}
/* счётчик и бейдж: моно 11 px на прозрачной терракоте */
[data-theme="editorial"] .badge{display:inline-block;padding:2px 7px;border-radius:999px;background:rgba(154,74,37,.12);color:var(--brand-2);font:500 11px/1.4 var(--mono);letter-spacing:.02em}
[data-theme="editorial"][data-mode="dark"] .badge{background:rgba(224,162,126,.16)}

/* 0.16.0: контраст на новой бумаге и второй поверхности ≥ 4.5:1 — группы меню без полупрозрачности; --faint и --paid чуть темнее (15-editorial.css) */
[data-theme="editorial"] .nav-g{opacity:1}
/* 0.8.5 (R083-05): текущая обложка в выборе фото */
.gph-pick .gph.cur{outline:3px solid var(--brand);outline-offset:-3px}
.gph-pick .gph:focus-visible{outline:3px solid var(--link,var(--brand));outline-offset:2px}
.gph-cur{position:absolute;right:6px;top:6px;width:24px;height:24px;border-radius:12px;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center}
.gph-cur svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.4}
/* 0.8.6: UI.mediaPicker и UI.pointPicker — загрузка, битая картинка, фокус */
.gph-pick .gph.is-loading{background:linear-gradient(90deg,var(--surface-2) 0%,var(--border) 50%,var(--surface-2) 100%);background-size:200% 100%;animation:skel 1.4s ease-in-out infinite}
.gph-pick .gph.is-loading img{opacity:0}
.gph-pick .gph img{transition:opacity .2s}
.gph-fallback{display:none}
.gph-pick .gph.is-broken img{display:none}
.gph-pick .gph.is-broken .gph-fallback{display:flex;align-items:center;justify-content:center;height:140px;padding:8px;font-size:12px;color:var(--muted);word-break:break-all;text-align:center;line-height:1.3}
.gde-focus.is-loading,.gde-focus.is-broken{min-width:200px;min-height:140px;background:var(--surface-2)}
.gde-focus.is-loading{background:linear-gradient(90deg,var(--surface-2) 0%,var(--border) 50%,var(--surface-2) 100%);background-size:200% 100%;animation:skel 1.4s ease-in-out infinite}
.gde-focus.is-broken img{display:none}
.gde-focus:focus-visible{outline:3px solid var(--link,var(--brand));outline-offset:2px}
@media (prefers-reduced-motion:reduce){.gph-pick .gph.is-loading,.gde-focus.is-loading{animation:none}}

/* 0.8.7 (UI086-22): «меньше движения» — меню, панель «Ещё» и полосы прогресса без выезда и плавности */
@media (prefers-reduced-motion:reduce){
  .side,.nav-scrim,.more,.more-scrim,.tb-new .tb-plus,.gd-prog .bar i,.toast{transition:none!important}
  html{scroll-behavior:auto}
}
.skip-link{position:fixed;left:12px;top:-60px;z-index:100;background:var(--surface);color:var(--ink);border:2px solid var(--link);border-radius:8px;padding:8px 14px;font:inherit;font-weight:600;cursor:pointer}
.skip-link:focus{top:calc(8px + env(safe-area-inset-top))}
#content:focus{outline:none}
/* 0.8.7 (UI086-14/15): имя или название без пробелов не растягивает колонку и не выходит за край */
.td-wrap{overflow-wrap:anywhere;min-width:96px}
/* 0.8.7 (UI086-21): широкая таблица на телефоне — тень у края, за которым есть ещё колонки (исчезает, когда долистали) */
@media (max-width:820px){
  .tbl-wrap{--sh-bg:var(--surface);background:
    linear-gradient(to right,var(--sh-bg) 40%,transparent) left center/28px 100% no-repeat local,
    linear-gradient(to left,var(--sh-bg) 40%,transparent) right center/28px 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%,rgba(0,0,0,.16),transparent) left center/12px 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.16),transparent) right center/12px 100% no-repeat scroll}
  [data-theme="editorial"] .card .tbl-wrap{--sh-bg:var(--paper)}
}

/* 0.9.0: вкладка «Видео» в галерее */
.gvd-list{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.gvd-row{display:flex;align-items:center;gap:14px;padding:10px;border:1px solid var(--border);border-radius:12px;background:var(--surface)}
.gvd-poster{flex:0 0 160px;aspect-ratio:16/9;border-radius:8px;overflow:hidden;background:#111;display:flex;align-items:center;justify-content:center;color:#888}
.gvd-poster img{width:100%;height:100%;object-fit:cover;display:block}
.gvd-poster svg,.gvd-acts svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:var(--ic-sw);stroke-linecap:round;stroke-linejoin:round}
.gvd-info{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:3px}
.gvd-info .small{overflow-wrap:anywhere}
.gvd-title{font:inherit;font-weight:600;font-size:15px;border:1px solid transparent;border-radius:8px;padding:6px 8px;margin-left:-8px;background:none;color:var(--ink);min-width:0;width:100%}
.gvd-title:hover{border-color:var(--border)}
.gvd-title:focus{outline:none;border-color:var(--brand);background:var(--surface-2);box-shadow:0 0 0 3px var(--focus)}
.gvd-acts{display:flex;align-items:center;gap:4px;flex:0 0 auto}
@media (max-width:640px){ .gvd-row{flex-wrap:wrap} .gvd-poster{flex-basis:100%} .gvd-acts{margin-left:auto} }
/* 0.9.4: финансы — год, CSV и «Расход» одной строкой; способ счёта — строкой выше */
.fin-csv-s{display:none}
@media (max-width:820px){
  .page-h .acts>.seg.fin-year{flex:0 0 auto;display:inline-flex}
  .page-h .acts>.seg.fin-year button{flex:0 0 auto;min-width:40px;padding-left:0;padding-right:0;justify-content:center}
  .page-h .acts>.seg.fin-year .seg-cur{padding:0 14px}
  .page-h .acts:has(.fin-year) [data-new-expense]{margin-left:auto}
}
@media (max-width:480px){
  .fin-csv-l{display:none}   /* 0.9.8: имя кнопки для диктора — aria-label «Выгрузить CSV» */
  .fin-csv-s{display:inline}
}
@media (max-width:360px){
  .page-h .acts>.seg.fin-year button{min-width:34px}
  .page-h .acts>.seg.fin-year .seg-cur{padding:0 10px}
  .page-h .acts:has(.fin-year) #fin-csv{padding-left:12px;padding-right:12px}
  .page-h .acts:has(.fin-year) [data-new-expense] svg{display:none}
}
/* 0.9.4: календарь на телефоне — пояс в «Ещё», здесь не повторяется: две строки кнопок вместо трёх */
@media (max-width:640px){ .page-h .acts .tz-switch.cal-tz{display:none} }
@keyframes cal-in-r{from{opacity:.4;transform:translateX(24px)}to{opacity:1;transform:none}}
@keyframes cal-in-l{from{opacity:.4;transform:translateX(-24px)}to{opacity:1;transform:none}}
.cal.cal-in-r{animation:cal-in-r .18s ease-out}.cal.cal-in-l{animation:cal-in-l .18s ease-out}
@media (prefers-reduced-motion:reduce){.cal.cal-in-r,.cal.cal-in-l{animation:none}}
.cw-item-s{display:none}
@media (max-width:360px){
  .cw-item-l{display:none}   /* 0.9.8: имя кнопки — aria-label «Другое событие» */
  .cw-item-s{display:inline}
  .page-h .acts .cal-nav .btn{min-width:40px}
}
@media (max-width:360px){
  html[data-theme] .page-h .acts .cal-nav{gap:4px}
  html[data-theme] .page-h .acts .cal-nav .btn{min-width:42px}
  html[data-theme] .page-h .acts .cal-nav #cw-today{padding:0 10px}
  html[data-theme] .page-h .acts #cw-item{padding-left:14px;padding-right:14px}
  html[data-theme] .page-h .acts #cw-item svg{display:none}
  html[data-theme] .page-h .acts:has(.cal-nav){column-gap:6px}
}
/* 0.9.4: демо-плашка на телефоне — одна строка: «Демо 0 из 3 событий · ещё 14 дней   [Тарифы]» */
.plan-banner .pb-s{display:none}
@media (max-width:640px){
  .plan-banner.trial{flex-wrap:nowrap;gap:10px;padding:5px 8px 5px 16px;font-size:12.5px;line-height:1.3}
  .plan-banner.trial>span.pb-s{display:block;flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .plan-banner.trial .btn .pb-s{display:inline}
  .plan-banner.trial .pb-l{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  html[data-theme] .plan-banner.trial .btn{min-height:34px;height:34px;padding:0 14px;font-size:12.5px;flex:0 0 auto}
}
@media (max-width:640px){ .plan-banner.trial .btn{position:relative} .plan-banner.trial .btn::after{content:"";position:absolute;inset:-5px -6px} }
@media (max-width:360px){
  .plan-banner.trial{gap:8px;padding-left:14px;font-size:12px}
  html[data-theme] .plan-banner.trial .btn{padding:0 12px;font-size:12px}
}
/* 0.9.5: шапка календаря на компьютере — две ровные строки:
   «Календарь / 2–8 ноября»            [+ Другое событие] [+ Новая съёмка]
   [‹] [Сегодня] [›]                         [День | Неделя | Месяц]        */
@media (min-width:821px){
  .page-h:has(.cal-nav){display:grid;grid-template-columns:minmax(0,1fr) auto auto;column-gap:10px;row-gap:18px;align-items:end}
  .page-h:has(.cal-nav)>div:first-child{grid-column:1;grid-row:1;min-width:0}
  .page-h:has(.cal-nav) .acts{display:contents}
  .page-h:has(.cal-nav) #cw-item{grid-column:2;grid-row:1}
  .page-h:has(.cal-nav) [data-new-order]{grid-column:3;grid-row:1}
  .page-h:has(.cal-nav) .cal-nav{grid-column:1;grid-row:2;justify-self:start}
  .page-h:has(.cal-nav) .acts>.seg{grid-column:2 / 4;grid-row:2;justify-self:end}
}
/* 0.9.6: вход по Face ID / Touch ID */
.auth-card .pk-btn{width:100%;min-height:44px;margin-top:10px;font-size:14px;gap:9px;justify-content:center}
[data-theme="editorial"] .auth-card .pk-btn{min-height:var(--ctl-h)}
.pk-btn svg,.pk-row>svg{width:20px;height:20px;flex:0 0 20px}
.pk-offer{text-align:center}
.pk-offer>svg{width:44px;height:44px;color:var(--brand);margin:4px auto 10px;display:block}
.pk-offer p{margin:0 0 10px}
.pk-list{display:flex;flex-direction:column;border:1px solid var(--border);border-radius:10px;overflow:hidden}
.pk-list>.small{padding:14px}
.pk-row{display:flex;align-items:center;gap:12px;padding:10px 8px 10px 14px;border-top:1px solid var(--border)}
.pk-row:first-child{border-top:0}
.pk-row>svg{color:var(--muted)}
.pk-i{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pk-i b{font-weight:600;overflow-wrap:anywhere}
.pk-name{font:inherit;font-weight:600;padding:4px 8px;border:1px solid var(--field-border);border-radius:6px;background:var(--surface);color:var(--ink);min-width:0}
.pk-row .btn.sm{min-width:36px;padding:0;justify-content:center}
.pk-pw{margin-top:14px}
/* 0.9.7: «сначала Face ID» — на устройстве, где уже входили по ключу */
.pk-pwlink{display:none;background:none;border:0;padding:12px 0 0;width:100%;font:inherit;font-size:14px;font-weight:600;color:var(--brand);cursor:pointer}
#f-login:not(.pk-first) #l-pk{order:10}
#f-login:not(.pk-first) #l-err{order:11}
#f-login{display:flex;flex-direction:column}
#f-login.pk-first>:not(#l-pk):not(#l-pwl):not(.err){display:none}
#f-login.pk-first .pk-pwlink{display:block}
#f-login.pk-first #l-pk{margin-top:4px}
/* 0.9.10: пояснение участнику в настройках */
.set-note{margin:0 0 14px;background:var(--surface-2);color:var(--muted);font-size:13px}
/* 0.15.1: язык на экранах входа и регистрации — кнопка со всплывающим списком (00a-i18n.js, langSwitch) */
.lang-pick{position:relative;margin-left:auto}
.lang-pick svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.lang-pick-btn{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 8px 0 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface-2);color:var(--ink);font:600 13px/1 var(--sans);cursor:pointer;transition:border-color .16s,background-color .16s}
.lang-pick-btn:hover{border-color:var(--border-strong)}
.lang-pick-btn[aria-expanded="true"]{border-color:var(--border-strong);background:var(--surface)}
.lang-pick-btn > svg{color:var(--muted)}
.lang-pick-btn .lp-chev{display:inline-flex;color:var(--muted);transition:transform .16s}
.lang-pick-btn .lp-chev svg{width:14px;height:14px}
.lang-pick-btn[aria-expanded="true"] .lp-chev{transform:rotate(180deg)}
.lang-pick-btn .lp-code{display:none;font-family:var(--mono);letter-spacing:.04em}
.lang-pick-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:60;min-width:200px;padding:6px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 12px 32px rgba(30,25,21,.14),0 2px 6px rgba(30,25,21,.06);transform-origin:top right;animation:lp-in .16s cubic-bezier(.2,0,0,1)}
@keyframes lp-in{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
.lang-pick-menu[hidden]{display:none}
.lang-pick-menu .lp-head{padding:6px 10px 6px;font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.lang-pick-menu button{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:40px;padding:0 10px;border:0;border-radius:8px;background:none;color:var(--ink);font:400 14px/1 var(--sans);text-align:left;cursor:pointer}
.lang-pick-menu button svg{opacity:0;color:var(--brand)}
.lang-pick-menu button[aria-checked="true"]{font-weight:600}
.lang-pick-menu button[aria-checked="true"] svg{opacity:1}
.lang-pick-menu button:hover,.lang-pick-menu button:focus-visible{background:var(--surface-2);outline:none}
.lang-pick-menu button:focus-visible{box-shadow:inset 0 0 0 2px var(--focus)}
@media (max-width:420px){
  .lang-pick-btn .lp-name{display:none}
  .lang-pick-btn .lp-code{display:inline}
  .lang-pick-menu button{min-height:44px}
}
@media (prefers-reduced-motion:reduce){ .lang-pick-menu{animation:none} .lang-pick-btn,.lang-pick-btn .lp-chev{transition:none} }
/* ===== 0.16.0 — стиль сайта в кабинете: строка метаданных, кольцо, плёнка на экране входа =====
   Источник — bookeh-site 0.10.0 (docs/bookeh-style-site-to-crm.md). Мотивы — только в теме «Редакция»; в остальных темах
   кольца и зерна нет, строка метаданных выглядит как прежняя подпись под заголовком.
   Правила: свет — одно место на экран и никогда под таблицей, формой или списком; ничего не двигается само. */

/* строка метаданных под заголовком страницы: «ЗАКАЗЫ · 8 АКТИВНЫХ · 3 БЕЗ ОПЛАТЫ». Основа — как прежняя подпись (.sub) */
.meta-line{margin:3px 0 0;color:var(--muted);font-size:13px}
.meta-line b{font-weight:inherit}
[data-theme="editorial"] .meta-line{margin:6px 0 0;font:500 11px/1.4 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
[data-theme="editorial"] .meta-line b{font-weight:500;color:var(--brand-2)}

/* курсивное слово в заголовке экрана входа — засечки, терракота */
.auth-card h1 em{font-style:normal}
[data-theme="editorial"] .auth-card h1 em{font-family:var(--display);font-style:italic;font-weight:400;color:var(--brand-2)}

/* кольцо. Вне «Редакции» его нет */
.ring{display:none}
[data-theme="editorial"] .ring{display:block;box-sizing:border-box;width:96px;aspect-ratio:1;border-radius:50%;border:10px solid currentColor;color:var(--ink);opacity:.85;flex:none}
[data-theme="editorial"] .ring.soft{filter:blur(14px);opacity:.35}
[data-theme="editorial"]:not([data-mode="dark"]) .ring.soft{color:#966848}   /* сепия на бумаге, как на сайте */
/* пустое состояние: кольцо над текстом */
[data-theme="editorial"] .empty .ring{margin:0 auto 18px}
[data-theme="editorial"] .empty:has(> .ring)::before{display:none}   /* кольцо — вместо рисунка «стопка карточек», не вместе с ним */
/* загрузка: кольцо появляется через 400 мс и «фокусируется» — вместо вращающегося индикатора. Быстрая загрузка его не показывает */
@keyframes ring-focus{from{filter:blur(12px);opacity:0}to{filter:blur(0);opacity:.85}}
[data-theme="editorial"] .ring.loading{width:40px;border-width:4px;margin:0 auto 12px;animation:ring-focus .6s cubic-bezier(.16,1,.3,1) .4s both}
[data-theme="editorial"] .empty.load .load-t{animation:load-t .2s linear .4s both}
@keyframes load-t{from{opacity:0}to{opacity:1}}
/* успех (оплата прошла): резкое кольцо с галочкой в уведомлении, один раз */
.toast .ring.done{display:none}
[data-theme="editorial"] .toast.ok{display:flex;align-items:center;gap:10px}
[data-theme="editorial"] .toast .ring.done{display:inline-grid;place-items:center;width:22px;border-width:2px;color:inherit;opacity:1;animation:ring-done .4s cubic-bezier(.16,1,.3,1) both}
[data-theme="editorial"] .toast .ring.done::after{content:"";width:8px;height:4px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-1px) rotate(-45deg)}
@keyframes ring-done{from{filter:blur(6px);opacity:.3}to{filter:blur(0);opacity:1}}

/* экран входа: размытое кольцо справа от формы (как на странице 404 сайта) и плёнка — зерно с двумя засветками.
   Слой неподвижный, рисуется один раз; внутри кабинета его нет — на таблицах он мешал бы читать */
[data-theme="editorial"] .auth{position:relative;overflow:hidden;isolation:isolate;background:var(--paper)}
[data-theme="editorial"] .auth::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:url(img/grain.png) 0 0/160px repeat,
    radial-gradient(55% 70% at -6% 12%,rgba(255,120,40,.16),transparent 70%),
    radial-gradient(40% 50% at 104% -6%,rgba(255,170,90,.10),transparent 70%)}
[data-theme="editorial"]:not([data-mode="dark"]) .auth::before{mix-blend-mode:multiply;opacity:.9}
[data-theme="editorial"] .auth-card{position:relative;z-index:2}
[data-theme="editorial"] .auth .auth-ring{position:fixed;z-index:1;right:max(-6vw,calc(50% - 620px));top:50%;width:min(34vw,460px);border-width:min(2.2vw,30px);filter:blur(32px);opacity:.5;transform:translateY(-50%);pointer-events:none}
[data-theme="editorial"]:not([data-mode="dark"]) .auth .auth-ring{opacity:.42}
@media (max-width:900px){[data-theme="editorial"] .auth .auth-ring{right:-22vw;top:16%;width:64vw;border-width:5vw;opacity:.4}}

/* движение: короткие переходы по кривой сайта; при «уменьшить движение» — без них, кольцо сразу резкое */
[data-theme="editorial"]{--e-ui:cubic-bezier(.2,0,0,1);--e-focus:cubic-bezier(.16,1,.3,1)}
[data-theme="editorial"] .btn,[data-theme="editorial"] .seg button,[data-theme="editorial"] .nav button,[data-theme="editorial"] .set-row{transition:background-color .16s var(--e-ui),color .16s var(--e-ui),border-color .16s var(--e-ui)}
@media (prefers-reduced-motion:reduce){
  [data-theme="editorial"] .ring.loading,[data-theme="editorial"] .toast .ring.done,[data-theme="editorial"] .empty.load .load-t{animation:none}
  [data-theme="editorial"] .btn,[data-theme="editorial"] .seg button,[data-theme="editorial"] .nav button,[data-theme="editorial"] .set-row{transition:none}
}

/* окно «Оформление»: режимов стало четыре — на узком телефоне они встают 2×2, а не сжимаются до обрезанных слов */
@media (max-width:520px){
  .mode-seg{display:grid;grid-template-columns:1fr 1fr;gap:4px;height:auto;border-radius:18px}
  .mode-seg button{min-width:0;white-space:normal;line-height:1.2;padding:6px 8px}
}