/* Presentation only: compact professional surfaces over the existing SaaS components. */
:root {
  --bg:#F6F7F5; --surface:#FFF; --soft:#F2F4F0; --ink:#142E28; --green:#0B3C33;
  --muted:#66736D; --line:#E4E8E1; --gold:#D99A45; --gold-ink:#82531B;
  --gold-soft:#FBF1E0; --lake:#246356; --lake-soft:#ECF4EF; --radius:14px;
  --shadow:0 2px 8px #17382e05;
  --body:"Inter",system-ui,sans-serif; --display:"Inter",system-ui,sans-serif;
}
body,body.saas { background:var(--bg); color:var(--ink); }
h1,h2,h3 { color:var(--ink); letter-spacing:-.025em; }
h1 { font-weight:700; }
h2 { font-size:19px; font-weight:650; }
h3 { font-size:15px; }
.card { border-radius:14px; border:1px solid var(--line); box-shadow:var(--shadow); background:#FFF; padding:20px; }
.btn { border-radius:9px; font-size:13px; min-height:42px; font-weight:550; box-shadow:none; }
.btn.primary { background:#D99A45; border-color:#C68D3F; color:#142E28; }
.btn.primary:hover { background:#E6AE64; border-color:#C68D3F; }
.btn.dark { background:var(--green); color:#FFF; }
.btn.danger { background:#FFF; color:#A63D35; border-color:#E9D5D2; }
input,select,textarea { min-height:44px; border-radius:9px; border-color:#DFE5DC; font-size:14px; background:#FFF; }
input:focus,select:focus,textarea:focus { outline:2px solid #A56A22; outline-offset:2px; }
label { font-size:12px; font-weight:550; gap:7px; color:#43534B; }
.chip { border-radius:8px; min-height:36px; font-size:12px; padding-inline:13px; }
.chip[aria-pressed=true] { background:var(--green); color:#FFF; border-color:var(--green); }
.status { border-radius:6px; font-size:11px; font-weight:550; padding:4px 7px; line-height:1.4; }
.note,.empty { border-radius:10px; }
/* Public entry: light editorial hero and the same three working role links. */
.bizhero { position:relative; color:var(--ink); border:1px solid var(--line); background:#FBFAF6; border-radius:18px; padding:32px 24px; }
.bizhero h1 { color:var(--ink); font-family:"Lora",Georgia,serif; font-size:31px; line-height:1.2; font-weight:600; letter-spacing:-.035em; }
.bizhero p { color:#52635A; font-size:14px; line-height:1.75; max-width:58ch; }
.bizhero .bizmark { background:#FBF1DE; color:#835116; }
.bizroles { gap:16px; }
.bizrole { padding:22px; border-radius:14px; gap:12px; }
.bizrole b { font-family:"Lora",Georgia,serif; font-size:22px; font-weight:600; }
.bizrole .small { font-size:13px; line-height:1.7; }
.bizrole .btn { margin-top:auto; }
.bizsteps { font-size:14px; line-height:1.7; }
/* The app chrome is intentionally quieter than the tourist UI. */
.snav button { border-radius:9px; font-size:13px; min-height:42px; font-weight:500; }
.snav button.on { color:var(--green); background:#F7ECDD; border-color:#E6D4B6; }
.snav button.on svg { color:#99631F; }
.sfoot { color:var(--muted); }
.sfoot a { color:#486457; text-decoration:none; }
.sfoot a:hover { text-decoration:underline; }
.stop { gap:16px; }
.stitle { font-size:27px; line-height:1.3; font-weight:650; }
.kpis4 { gap:14px; }
.kpi { border-radius:12px; padding:18px; gap:8px; border-color:#E1E6DC; }
.kpi-l { font-size:12px; }
.kpi-v { font:700 28px/1.1 var(--body); letter-spacing:-.035em; font-variant-numeric:tabular-nums; }
.kpi-d { font-size:11px; }
.kpi.k-gold { background:#FCF5EA; border-color:#F0E3CD; }
.kpi.k-blue { background:#EFF5FA; border-color:#E0E9F0; }
.kpi.k-rose { background:#F7F2F9; border-color:#EAE0F0; }
.kpi.k-green { background:#F0F6F0; border-color:#DFEADF; }
.toolbar { gap:12px; align-items:center; }
.toolbar-r > .btn { flex-shrink:0; white-space:nowrap; }
.msel,.tsearch { min-height:40px; border-radius:8px; }
.qa { min-height:43px; border-radius:9px; font-size:13px; font-weight:500; background:#FCFDFC; padding:10px 12px; }
.qa svg { color:#425C50; }
.orow { padding:10px 4px; border-radius:8px; }
.orow img,.orow .oicon { border-radius:9px; }
.orow-t b { font-size:13px; font-weight:600; }
.orow-s { font-size:14px; font-variant-numeric:tabular-nums; }
.orow-t .small { font-size:11px; }
.linkbtn { color:#835416; font-size:12px; font-weight:550; }
/* Tables retain the established mobile card transformation. */
.tcard { padding:0; overflow:hidden; }
.dtable { font-variant-numeric:tabular-nums; }
.dtable th { background:#F8FAF6; color:#6C786F; font-weight:550; }
.dtable td { color:#30473A; }
.dtable td.tcell b { font-weight:600; }
.dtable td.num { color:#1B352B; }
.dtable td .btn { border-radius:7px; }
.dtable tr.trow:hover td { background:#FCF9F2; }
.dtable tr.drow>td { background:#F9FBF6; }
/* Constructor: clear steps, calm forms and a readable calculation rail. */
.stepper { gap:10px; scrollbar-color:#BD985E #F0F1EB; }
.stepper li { min-width:145px; }
.stepper button { min-height:76px; border-radius:11px; padding:13px; background:#FFF; border-color:var(--line); }
.stepper .stepn { width:29px; height:29px; font-size:12px; }
.stepper .stept b { font-size:12px; }
.stepper .small { font-size:11px; }
.stepper li.on button { background:#FBF4E8; border-color:#D4AC70; }
.dayblock { padding:19px; border-radius:14px; }
.titem { background:#F7F8F3; border:1px solid #E8EDE3; border-radius:10px; padding:14px; gap:10px; }
.titem-ctl { gap:10px; }
.titem-ctl label { font-size:11px; }
.titem-ctl .btn { border-radius:8px; }
.sumcard { border:1px solid #CCD8CA; border-radius:14px; box-shadow:0 3px 12px #18332905; }
.sumcard .subrow { border-radius:8px; background:#F7F9F4; border:0; padding:11px 12px; font-size:12px; }
.sumcard .subrow b { font-size:15px; font-variant-numeric:tabular-nums; }
.sumcard label { gap:9px; }
.ed-side>.card:not(.sumcard) { padding:16px; }
.offer { border-radius:12px; padding:16px; gap:14px; background:#FFF; }
.offer>img { width:88px; height:88px; border-radius:10px; }
.offer .grow { min-width:160px; gap:5px; }
.offer .price-ag { font-size:17px; }
.offer .small { line-height:1.5; }
.lchart { border-radius:10px; background:#FCFDFB; }
.bartrack { height:7px; background:#E9EEE6; }
.barfill { background:#1A6554; }
.barname { font-size:12px; }
.thero { border-radius:18px; }
.tfacts { gap:12px; }
.tfacts>div { background:#FFF; border-radius:11px; border-color:var(--line); }
@media(min-width:1000px) {
  body.saas { background:#F6F7F4!important; }
  .saas-shell { grid-template-columns:228px minmax(0,1fr); }
  .sbar { padding:24px 14px 18px; border-color:#E4E8E0; gap:20px; }
  .sbrand { gap:5px; padding-inline:7px; }
  .sbrand img:first-child { height:25px; }
  .sbrand img:nth-child(2) { height:22px; }
  .sbrand .bizmark { font-size:8px; padding:2px 5px; }
  .snav { gap:5px; }
  .snav button { padding:11px 12px; }
  .smain { padding:25px 32px 60px; gap:22px; }
  .stop { min-height:61px; padding-bottom:18px; border-bottom:1px solid var(--line); }
  .sava { width:36px; height:36px; font-size:12px; }
  .sme b { font-size:13px; }
  .sme .small { font-size:11px; }
  .dtable th { padding:13px 16px; font-size:11px; }
  .dtable td,.dtable tr.trow td { padding:15px 16px; font-size:12px; }
  .dtable td.tthumb>img { width:44px; height:44px; border-radius:8px; }
  .dtable td.acts .btn { font-size:11px; min-height:32px; }
  .ovgrid { grid-template-columns:minmax(0,1.8fr) minmax(280px,1fr); gap:18px; }
  .angrid { grid-template-columns:minmax(0,1.7fr) minmax(280px,1fr); gap:18px; }
  .orow { grid-template-columns:48px minmax(0,1fr) 78px 118px 85px; column-gap:12px; }
  .orow>.status { font-size:10px; }
  .orow>.small { font-size:11px; }
  .bizhero { min-height:360px; padding:48px; background:linear-gradient(90deg,#FDFBF6 0%,#FDFBF6 43%,#FDFBF6D9 58%,#FDFBF610 80%),url('https://images.unsplash.com/photo-1664602078796-68ee76b3fc59?auto=format&fit=crop&w=1400&q=85') right center/60% auto no-repeat; }
  .bizhero::before { content:none; }
  .bizhero h1 { max-width:610px; font-size:40px; }
  .bizhero p { max-width:540px; }
  /* Auth keeps its working OTP flow; the second column is decorative. */
  .wrap:has(#email) { margin:3vh auto; max-width:1040px; min-height:600px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.85fr); align-content:center; gap:24px; padding:34px; background:#FFF; border:1px solid var(--line); border-radius:20px; box-shadow:0 12px 50px #142E2808; overflow:hidden; position:relative; }
  .wrap:has(#email)::after { content:''; position:absolute; inset:0 0 0 57%; background:linear-gradient(#0A382A10,#0A382A10),url('https://images.unsplash.com/photo-1664602078796-68ee76b3fc59?auto=format&fit=crop&w=1400&q=85') center/cover no-repeat; }
  .wrap:has(#email)>.topbar { grid-column:1; border:0; margin:0; padding-top:0; }
  .wrap:has(#email)>form { grid-column:1; padding:10px 10px 22px; border:0; border-radius:0; box-shadow:none; max-width:420px; }
  .wrap:has(#email)>form h1 { font-family:"Lora",Georgia,serif; font-size:31px; font-weight:600; }
  .wrap:has(#email)>form .btn.primary { background:var(--green); border-color:var(--green); color:#FFF; margin-top:10px; }
  .wrap:has(#email)>.topbar .tourlink { display:none; }
}
@container(max-width:560px) {
  .orow { grid-template-columns:48px minmax(0,1fr) auto; }
}
@media(max-width:999px) {
  body { background:var(--bg); padding-inline:16px; }
  .wrap { gap:20px; padding-top:0; }
  .topbar { min-height:76px; gap:8px; padding-top:10px; padding-bottom:0; }
  .topbar .brand { align-items:center; gap:4px; }
  .topbar .brand .emb { height:27px; }
  .topbar .brand .wm { height:22px; margin-top:2px; }
  .bizmark { font-size:8px; padding:3px 6px; }
  .tourlink { font-size:11px; }
  .saas-shell { gap:20px; }
  .sbar { border-bottom:1px solid var(--line); padding-bottom:12px; }
  .snav { gap:7px; padding-bottom:8px; scrollbar-width:thin; scrollbar-color:#C3CCBF transparent; }
  .snav::-webkit-scrollbar { display:block; height:3px; }
  .snav::-webkit-scrollbar-thumb { background:#C3CCBF; }
  .snav button { padding:9px 13px; font-size:12px; min-height:40px; }
  .sfoot { font-size:11px; gap:10px; padding:5px 1px; }
  .sfoot .small { font-size:11px; }
  .sside { border-top:1px solid var(--line); margin-top:6px; padding-top:12px; }
  .sside .qa { max-width:100%; }
  .stitle { font-size:25px; }
  .spanel { gap:18px; }
  .kpis4 { gap:10px; }
  .kpi { padding:15px 13px; min-height:112px; }
  .kpi-v { font-size:25px; }
  .kpi-l { font-size:11px; }
  .orow { grid-template-columns:44px minmax(0,1fr) auto; gap:5px 10px; }
  .orow>img,.orow>.oicon { width:44px; height:52px; grid-row:1 / span 3; }
  .orow-t { grid-column:2;grid-row:1; }
  .orow>.small { display:block;grid-column:2;grid-row:2;font-size:10px; }
  .orow>.status { display:inline-flex;grid-column:2;grid-row:3;justify-self:start;font-size:10px; }
  .orow-s { grid-column:3;grid-row:1 / span 3; font-size:13px; }
  .orow-t b { font-size:12px; }
  .orow-t .small { font-size:10px; }
  .dtable tr.trow,.dtable tbody tr:not(.trow):not(.drow) { padding:16px; gap:12px; background:#FFF; }
  .dtable td { font-size:13px; }
  .dtable td[data-l]::before { font-size:10px; margin-bottom:3px; }
  .dtable td.tcell b { font-size:14px; }
  .dtable td.acts .btn { min-height:38px; font-size:12px; }
  .stepper button { padding:11px; min-height:74px; }
  .stepper li { min-width:145px; }
  .offer { gap:12px; }
  .offer>img { width:78px; height:88px; }
  .offer .grow { min-width:160px; }
  .offer>.chips { width:100%; flex-wrap:wrap; justify-content:flex-end; }
  .sumcard .subrow { font-size:12px; }
  .tabbar { background:#FFF; border-top:1px solid var(--line); box-shadow:0 -4px 16px #17382e05; min-height:70px; }
  .tabbar a { font-size:10px; min-width:0; gap:5px; color:#64716A; }
  .tabbar a.on { color:var(--green); }
  .bizhero { padding:27px 22px; }
  .bizhero h1 { font-size:29px; }
  .wrap:has(#email)>form { padding:24px 20px; }
  .wrap:has(#email)>form h1 { font-family:"Lora",Georgia,serif; font-size:28px; font-weight:600; }
  .wrap:has(#email)>form .btn.primary { background:var(--green); border-color:var(--green); color:#FFF; }
}
@media(min-width:1000px) and (max-width:1199px) {
  .saas-shell { grid-template-columns:210px minmax(0,1fr); }
  .smain { padding-inline:24px; }
  .ovgrid,.angrid { grid-template-columns:1fr; }
  .editor { grid-template-columns:minmax(0,1fr) 310px; }
}
@media(max-width:350px) {
  .topbar .brand .emb { height:22px; }
  .topbar .brand .wm { height:19px; }
  .topbar .bizmark { font-size:7px; padding:2px 4px; }
  .offer .grow { min-width:135px; }
}


/* Белый фон везде (решение владельца, 16.10.2026). Подключается последним, поэтому перекрывает кремовый фон. */
:root { --bg:#FFFFFF; }
html, body:not(.reelmode) { background:#FFFFFF; }
.sheet, .reelsheetbox { background:#FFFFFF; }
@media (max-width: 999px) { :root { --bg:#FFFFFF; } html, body:not(.reelmode) { background:#FFFFFF; } .sheet { background:#FFFFFF; } }
@media (min-width: 1000px) { :root { --bg:#FFFFFF; } body.saas { background:#FFFFFF !important; } }
