/* Sport Farm — три стиля (владелец: «классика светлый под macOS, мрак — в стиле Diablo 2, сказочный — в стиле
   Mobile Legends»). Стили нарисованы «по мотивам» — свои цвета, рамки и фоны из игры Арена, без чужих картинок и логотипов. */
:root{
  --bg:#f5f5f7; --bg-img:none; --login-img:none; --panel:#ffffffcc; --panel-solid:#fff; --panel2:#f0f0f3; --line:#d9d9de;
  --text:#1d1d1f; --muted:#6e6e73; --accent:#0a84ff; --accent-text:#fff; --accent2:#5e5ce6;
  --ok:#28a745; --warn:#ff9f0a; --bad:#ff3b30; --bad-bg:#ff3b3014; --ok-bg:#28a74514;
  --radius:10px; --shadow:0 1px 3px #0000001a, 0 8px 24px #0000000f; --blur:saturate(180%) blur(20px);
  --font:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --title-font:var(--font); --title-color:var(--text); --title-shadow:none; --btn-bg:#fff; --btn-line:#d2d2d7;
  --side:#f7f7f9cc; --side-active:#0a84ff1f; --input:#fff;
}
.theme-dark{
  --bg:#0b0907; --bg-img:url(img/bg2.jpg); --login-img:url(img/login2.jpg); --panel:#15110ee6; --panel-solid:#15110e; --panel2:#201a14; --line:#4a3a28;
  --text:#d9c9a8; --muted:#8f7d62; --accent:#8a1c14; --accent-text:#f3e2bd; --accent2:#c8a45a;
  --ok:#6fa84a; --warn:#d49a2a; --bad:#d9412f; --bad-bg:#5a130e55; --ok-bg:#2f4a1d55;
  --radius:2px; --shadow:0 0 0 1px #000, inset 0 0 0 1px #6b5436, 0 6px 20px #000c; --blur:none;
  --font:"Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  --title-font:"Palatino Linotype", Georgia, serif; --title-color:#c8a45a; --title-shadow:0 1px 0 #000, 0 0 8px #000;
  --btn-bg:linear-gradient(#2b221a,#16110c); --btn-line:#6b5436; --side:#0d0a08ee; --side-active:#3a1410; --input:#0e0b08;
}
.theme-fairy{
  --bg:#1b2a6b; --bg-img:url(img/bg3.jpg); --login-img:url(img/login3.jpg); --panel:#14215cdd; --panel-solid:#14215c; --panel2:#1d2d78; --line:#4d6fd6;
  --text:#f2f6ff; --muted:#aab8e8; --accent:#ffb300; --accent-text:#1a1440; --accent2:#3fd0ff;
  --ok:#3ee07a; --warn:#ffcc33; --bad:#ff5a6e; --bad-bg:#ff5a6e2a; --ok-bg:#3ee07a22;
  --radius:14px; --shadow:0 0 0 2px #e0b34a, 0 0 18px #3fd0ff55, 0 10px 30px #0008; --blur:blur(6px);
  --font:"Trebuchet MS", "Segoe UI", Verdana, sans-serif;
  --title-font:"Trebuchet MS", "Segoe UI", sans-serif; --title-color:#ffe28a; --title-shadow:0 2px 0 #7a3b00, 0 0 12px #ffb30088;
  --btn-bg:linear-gradient(#3a5bd8,#243a9e); --btn-line:#e0b34a; --side:#101a4ee6; --side-active:#ffb30033; --input:#0f1a4f;
}
/* Корпоративные стили (владелец: «добавь ещё 2 стиля корпоративных… придумай под каждый свой стиль»).
   Sportfarm — как этикетки SportFarm laboratory: белый флакон, лабораторные шестиугольники, свежий зелёный, цитрусовый акцент.
   Glanzenheil — «блеск и здоровье»: глубокий бирюзовый, серебро и белый, глянцевые кнопки. */
.theme-sportfarm{
  --bg:#f3f8f2; --bg-img:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='98' viewBox='0 0 56 98'%3E%3Cpath d='M28 66L0 50V16L28 0l28 16v34L28 66zm0 32L0 82V66l28 16 28-16v16L28 98z' fill='none' stroke='%231f8a4c' stroke-opacity='.07' stroke-width='1.5'/%3E%3C/svg%3E");
  --login-img:linear-gradient(135deg,#e9f6ea,#fff 45%,#fff3e3); --panel:#ffffffee; --panel-solid:#fff; --panel2:#eef7ef; --line:#cfe3d2;
  --text:#18311f; --muted:#5f7a66; --accent:#1f8a4c; --accent-text:#fff; --accent2:#ff8a1f;
  --ok:#1f8a4c; --warn:#e07b00; --bad:#d93838; --bad-bg:#d9383812; --ok-bg:#1f8a4c14;
  --radius:8px; --shadow:0 1px 2px #1f8a4c1a, 0 6px 18px #1f8a4c14; --blur:none;
  --font:"Segoe UI", -apple-system, Roboto, Arial, sans-serif; --title-font:Georgia, "Times New Roman", serif; --title-color:#1f6b3c; --title-shadow:none;
  --btn-bg:#fff; --btn-line:#bcd8c2; --side:#ffffff; --side-active:#1f8a4c18; --input:#fff;
}
.theme-sportfarm h1,.theme-sportfarm h2{letter-spacing:.5px}
.theme-sportfarm .side{border-right:3px solid #1f8a4c}
.theme-sportfarm .card{border-top:3px solid #1f8a4c}
.theme-sportfarm button.pri{background:linear-gradient(#27a35b,#1f8a4c)}
.theme-sportfarm .nav.on{border-left:3px solid #ff8a1f}
.theme-glanzenheil{
  --bg:#e8f1f2; --bg-img:linear-gradient(160deg,#0f4c55 0,#0f4c55 180px,#e8f1f2 180px);
  --login-img:radial-gradient(circle at 30% 20%,#2bb3c0,#0f4c55 60%,#082f35); --panel:#ffffff; --panel-solid:#fff; --panel2:#eef6f7; --line:#c8dde0;
  --text:#123036; --muted:#5b7b80; --accent:#0f7c8a; --accent-text:#fff; --accent2:#18a7b5;
  --ok:#11866f; --warn:#d98a00; --bad:#c9384a; --bad-bg:#c9384a12; --ok-bg:#11866f14;
  --radius:16px; --shadow:0 2px 6px #0f4c5522, 0 12px 30px #0f4c551a; --blur:none;
  --font:"Segoe UI", "Helvetica Neue", Arial, sans-serif; --title-font:"Segoe UI Semibold", "Segoe UI", Arial, sans-serif; --title-color:#0f4c55; --title-shadow:none;
  --btn-bg:linear-gradient(#ffffff,#e9f2f3); --btn-line:#b7d3d7; --side:linear-gradient(#0f4c55,#0b3a41); --side-active:#ffffff26; --input:#fff;
}
.theme-glanzenheil .side{color:#e6f6f7;border-right:none}
.theme-glanzenheil .side .nav{color:#e6f6f7}
.theme-glanzenheil .side .nav:hover{background:#ffffff1a}
.theme-glanzenheil .side .brand b{color:#fff}
.theme-glanzenheil .side .brand small,.theme-glanzenheil .side .who{color:#a9d6db}
.theme-glanzenheil button{border-radius:999px}
.theme-glanzenheil button.pri{background:linear-gradient(#27c0cc,#0f7c8a);box-shadow:inset 0 1px 0 #ffffff66, 0 2px 6px #0f4c5555}
.theme-glanzenheil h1{color:#fff}
.theme-glanzenheil .card{border:1px solid #d7e8ea}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg) var(--bg-img) center/cover fixed;color:var(--text);font:15px/1.45 var(--font)}
.theme-dark body::before,.theme-fairy body::before{content:"";position:fixed;inset:0;pointer-events:none;background:#0006}
.theme-fairy body::before{background:linear-gradient(#0a1440aa,#0a144066)}
.boot{padding:40px;text-align:center;color:var(--muted)}
h1,h2,h3{font-family:var(--title-font);color:var(--title-color);text-shadow:var(--title-shadow);margin:0 0 10px;font-weight:700;letter-spacing:.2px}
h1{font-size:22px} h2{font-size:18px} h3{font-size:15px}
.theme-dark h1,.theme-dark h2{letter-spacing:1.5px;text-transform:uppercase}
.theme-fairy h1,.theme-fairy h2{font-style:italic}
a{color:var(--accent2)}
.muted{color:var(--muted)} .small{font-size:12px} .right{text-align:right} .nowrap{white-space:nowrap}
.bad{color:var(--bad);font-weight:700} .ok{color:var(--ok)} .warn{color:var(--warn)}

/* каркас */
.shell{display:flex;min-height:100vh;position:relative;z-index:1}
.side{width:230px;flex:none;background:var(--side);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border-right:1px solid var(--line);padding:14px 10px;display:flex;flex-direction:column;gap:2px;position:sticky;top:0;height:100vh;overflow:auto}
.brand{display:flex;align-items:center;gap:10px;padding:4px 8px 14px}
.brand img{width:34px;height:34px;border-radius:8px}
.brand b{font-family:var(--title-font);color:var(--title-color);text-shadow:var(--title-shadow);font-size:16px;line-height:1.1}
.brand small{display:block;color:var(--muted);font-size:11px;font-weight:400}
.nav{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--radius);color:var(--text);text-decoration:none;cursor:pointer;border:1px solid transparent;font-size:14px;user-select:none}
.nav:hover{background:var(--panel2)}
.nav.on{background:var(--side-active);border-color:var(--line)}
.theme-dark .nav.on{color:#f0d9a0;border-color:#8a1c14}
.nav .ic{width:22px;text-align:center}
.nav .cnt{margin-left:auto;background:var(--bad);color:#fff;border-radius:10px;font-size:11px;padding:1px 7px}
.nav.hid{opacity:.85}
.sep{height:1px;background:var(--line);margin:8px 6px}
.who{margin-top:auto;padding:10px;font-size:12px;color:var(--muted)}
.main{flex:1;min-width:0;padding:22px 26px 60px}
.card{background:var(--panel);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px;margin:0 0 16px}
.theme-dark .card{border:1px solid #6b5436;background:linear-gradient(#1a1410ee,#0f0c09ee)}
.theme-fairy .card{border:1px solid #e0b34a88}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.grow{flex:1}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.kpi{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.kpi .card{flex:1 1 180px;margin:0}
.kpi b{display:block;font-size:22px;font-family:var(--title-font);color:var(--title-color)}

/* кнопки и поля */
button,.btn{font:inherit;font-size:14px;padding:7px 14px;border-radius:calc(var(--radius) - 2px);border:1px solid var(--btn-line);background:var(--btn-bg);color:var(--text);cursor:pointer;line-height:1.2}
button:hover{filter:brightness(1.08)}
button:disabled{opacity:.45;cursor:default}
button.pri{background:var(--accent);color:var(--accent-text);border-color:transparent;font-weight:600}
.theme-dark button{text-transform:uppercase;letter-spacing:1px;font-size:12px;box-shadow:inset 0 1px 0 #ffffff14, 0 1px 0 #000}
.theme-dark button.pri{background:linear-gradient(#a3261b,#5e110b);border-color:#c8a45a;color:#f3e2bd}
.theme-fairy button{border-width:2px;border-radius:999px;font-weight:700;text-shadow:0 1px 0 #0006}
.theme-fairy button.pri{background:linear-gradient(#ffd54a,#ff9800);color:#3a1d00;text-shadow:none;box-shadow:0 3px 0 #a55a00,0 0 12px #ffb30088}
button.danger{background:var(--bad);color:#fff;border-color:transparent}
button.link{background:none;border:none;color:var(--accent2);padding:2px 4px;text-decoration:underline}
input,select,textarea{font:inherit;font-size:14px;padding:7px 10px;border-radius:calc(var(--radius) - 2px);border:1px solid var(--line);background:var(--input);color:var(--text);min-width:0}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent2);outline-offset:0}
input[type=number]{width:120px}
label.f{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
label.f > *{font-size:14px;color:var(--text)}

/* таблицы */
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{text-align:left;font-weight:600;color:var(--muted);font-size:12px;border-bottom:1px solid var(--line);padding:6px 8px;position:sticky;top:0;background:var(--panel-solid);z-index:1}
.tbl td{border-bottom:1px solid var(--line);padding:6px 8px;vertical-align:middle}
.tbl tr.short td{background:var(--bad-bg)}
.tbl tr.grp td{background:var(--panel2);font-weight:700;color:var(--title-color)}
.tbl td.num,.tbl th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.tbl input[type=text],.tbl input[type=number]{width:110px;text-align:right}
.tbl tfoot td{font-weight:700;border-top:2px solid var(--line)}
.scroll{max-height:66vh;overflow:auto}
.pill{display:inline-block;padding:1px 8px;border-radius:999px;font-size:12px;border:1px solid var(--line);white-space:nowrap}
.pill.ok{background:var(--ok-bg);border-color:var(--ok)} .pill.bad{background:var(--bad-bg);border-color:var(--bad);color:var(--bad)} .pill.warn{border-color:var(--warn);color:var(--warn)}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.tabs button.on{background:var(--accent);color:var(--accent-text)}

/* вход */
.login{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--login-img) center/cover;position:relative;z-index:1}
.login .card{width:min(380px,92vw);padding:26px}
.login h1{text-align:center}
.login form{display:flex;flex-direction:column;gap:12px}
.err{color:var(--bad);min-height:20px;font-size:13px}

/* окно */
.modal{position:fixed;inset:0;background:#0008;display:flex;align-items:center;justify-content:center;z-index:50;padding:16px}
.modal .card.wide{width:min(920px,100%)}
.modal .tbl select{width:100%;max-width:560px}
.modal .card{width:min(560px,100%);max-height:90vh;overflow:auto;margin:0;background:var(--panel-solid)}
#toast{position:fixed;right:18px;bottom:18px;z-index:60;display:flex;flex-direction:column;gap:8px}
#toast div{background:var(--panel-solid);color:var(--text);border:1px solid var(--line);border-left:4px solid var(--accent2);padding:10px 14px;border-radius:var(--radius);box-shadow:var(--shadow);max-width:360px}
#toast div.e{border-left-color:var(--bad)}

/* стили — выбор */
.themes{display:flex;gap:12px;flex-wrap:wrap}
.themes .t{width:180px;border-radius:12px;border:2px solid var(--line);cursor:pointer;overflow:hidden;background:var(--panel2)}
.themes .t.on{border-color:var(--accent2);box-shadow:0 0 0 3px var(--accent2)}
.themes .t .pv{height:90px;background:center/cover}
.themes .t div{padding:6px 10px;font-size:13px}

/* телефон */
.burger{display:none}
@media (max-width:820px){
  .side{position:fixed;left:0;top:0;z-index:40;transform:translateX(-100%);transition:transform .2s;box-shadow:var(--shadow)}
  .side.open{transform:none}
  .burger{display:inline-block;position:fixed;top:10px;left:10px;z-index:41}
  .main{padding:56px 12px 40px}
  .tbl{font-size:13px} .tbl input[type=text],.tbl input[type=number]{width:84px}
}

/* печать раскладки */
.print-only{display:none}
@media print{
  body{background:#fff!important;color:#000!important;font:12px/1.35 Arial,sans-serif}
  body::before{display:none!important}
  .side,.burger,.no-print,#toast{display:none!important}
  .main{padding:0}
  .card{box-shadow:none!important;background:#fff!important;border:none!important;padding:0;backdrop-filter:none}
  h1,h2,h3{color:#000!important;text-shadow:none!important;text-transform:none!important;font-family:Arial,sans-serif!important}
  .tbl th{background:#fff!important;color:#000}
  .tbl td,.tbl th{border-bottom:1px solid #999;color:#000}
  .tbl tr.short td{background:#eee!important}
  .print-only{display:block}
  input{border:none;background:none}
}

/* версия и дата релиза — мелко внизу справа (владелец 28.09) */
#ver{position:fixed;right:10px;bottom:6px;font-size:11px;color:var(--muted);opacity:.75;z-index:50;pointer-events:none}
.perms{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px;margin-top:8px}
.chk{display:flex;align-items:center;gap:8px;cursor:pointer}
.chk input{flex:0 0 auto;width:16px;height:16px;margin:0}
/* выпадающий список с поиском (расходы и доходы) */
.combo{position:relative;display:flex}
.combo input{flex:1;border-top-right-radius:0;border-bottom-right-radius:0}
.combo>button{border-top-left-radius:0;border-bottom-left-radius:0;padding:0 10px;margin-left:-1px}
.combo-list{position:absolute;left:0;right:0;top:100%;z-index:40;max-height:260px;overflow:auto;background:var(--panel-solid);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);margin-top:2px}
.combo-list .ci{padding:8px 12px;cursor:pointer;color:var(--text)}
.combo-list .ci.on,.combo-list .ci:hover{background:var(--panel2)}
.combo-list .ci.new{color:var(--accent2);border-top:1px solid var(--line)}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.seg button{border:0;border-radius:0;margin:0}
.seg button.on{background:var(--accent);color:var(--accent-text)}
/* отчёт по компании: графики */
.chart{width:100%;height:auto;display:block}
.chart .ax{stroke:var(--line);stroke-width:1}
.chart .pa{fill:var(--muted);opacity:.55}
.chart .pb{fill:var(--accent)}
.chart .lb{font-size:11px;fill:var(--text);text-anchor:middle}
.chart .cat{font-size:11px;fill:var(--muted);text-anchor:middle}
.chart polyline{stroke-width:2.5}
.chart .l1{stroke:var(--accent);fill:var(--accent)}
.chart .l2{stroke:#2e9d5b;fill:#2e9d5b}
.chart .l3{stroke:var(--accent2);fill:var(--accent2)}
.chart .l4{stroke:#d9534f;fill:#d9534f}
.chart polyline.l1,.chart polyline.l2,.chart polyline.l3,.chart polyline.l4{fill:none}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:6px}
.legend i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.legend i.pa{background:var(--muted);opacity:.55}.legend i.pb,.legend i.l1{background:var(--accent)}
.legend i.l2{background:#2e9d5b}.legend i.l3{background:var(--accent2)}.legend i.l4{background:#d9534f}
.tbl.rep tr.tot td{border-top:2px solid var(--line)}
.tbl.rep tr.big td{font-size:16px}
/* чат, профили, инструкции */
.chat{display:grid;grid-template-columns:280px 1fr;gap:16px;align-items:start}
.chat .chl{max-height:calc(100vh - 140px);overflow:auto;padding:12px}
.chi{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:0;background:transparent;padding:8px;margin:0 0 2px;border-radius:var(--radius)}
.chi:hover,.chi.on{background:var(--panel2)}
.chi .cnt{background:#e0443e;color:#fff;border-radius:10px;padding:1px 7px;font-size:12px}
.ava{display:inline-block;border-radius:50%;object-fit:cover;background:var(--accent);color:var(--accent-text);text-align:center;font-weight:600;flex:0 0 auto}
.avw{position:relative;display:inline-block}.avw .dot{position:absolute;right:0;bottom:0;width:10px;height:10px;border-radius:50%;background:#2e9d5b;border:2px solid var(--panel-solid)}
.chm{display:flex;flex-direction:column;min-height:60vh}
.msgs{flex:1;overflow:auto;max-height:calc(100vh - 290px);min-height:300px;padding:6px 2px}
.msg{display:flex;gap:8px;align-items:flex-end;margin-top:10px}.msg.same{margin-top:2px}
.msg.mine{flex-direction:row-reverse}
.msg .avsp{width:28px;flex:0 0 28px}
.bub{max-width:70%;background:var(--panel2);border-radius:14px;padding:7px 11px;white-space:pre-wrap;word-wrap:break-word}
.msg.mine .bub{background:var(--accent);color:var(--accent-text)}
.bub .tm{font-size:10px;opacity:.6;margin-left:8px}
.chin{margin-top:8px}.chin textarea{flex:1;resize:vertical}
ol.steps li{margin:8px 0;line-height:1.5}
@media (max-width:800px){.chat{grid-template-columns:1fr}.chat .chl{max-height:260px}}
.ro-note{display:inline-block;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:2px 10px;margin-bottom:8px}
.ro-off{opacity:.55;cursor:not-allowed}