/* Кабинет счетчика: только специфичное, токены и база — из /assets/brand.css. */
body{overflow-x:hidden}
a{color:inherit}
.top{display:flex;align-items:center;gap:28px;flex-wrap:wrap;padding:18px 72px 10px 24px}
.top .brand{text-decoration:none;color:var(--text)}
.tabs{display:flex;gap:4px;flex-wrap:wrap}
.tabs a{padding:8px 14px;border-radius:var(--radius-pill);text-decoration:none;color:var(--muted);font-size:15px}
.tabs a.on{background:var(--card);color:var(--text);box-shadow:var(--shadow-card);border:1px solid var(--line)}
@media (hover:hover){.tabs a:hover{color:var(--text)}}
.wrap{max-width:1180px;margin:0 auto;padding:12px 24px 56px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-card);box-shadow:var(--shadow-card)}
h1{font-size:28px;font-weight:700;letter-spacing:-.02em;margin:0}
h2{font-size:18px;font-weight:700;margin:28px 0 12px}
.muted{color:var(--muted)}
.empty{color:var(--muted);padding:18px}
.head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:14px 0 20px}
.period{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:14px}
.period input,.login input{font:inherit;color:var(--text);background:var(--card);border:1px solid var(--line);
  border-radius:10px;padding:8px 10px}
.period input{width:118px;margin-left:6px}
.btn-s{font:inherit;font-size:14px;font-weight:600;border:0;border-radius:var(--radius-pill);padding:9px 18px;
  background:var(--text);color:var(--bg);cursor:pointer}
.btn-s.ghost{background:transparent;color:var(--text);border:1px solid var(--line)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px}
.kpi{padding:16px 18px;display:flex;flex-direction:column;gap:6px}
.kpi span{color:var(--muted);font-size:13px}
.kpi b{font-size:28px;font-weight:700;letter-spacing:-.02em}
.chart{margin-top:18px;padding:18px 20px}
.chart h2{margin:0 0 14px;font-size:16px}
.chart svg{width:100%;height:180px;display:block}
.axis-labels{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-top:6px}
.chart rect{fill:#6293ED}
.chart .axis{stroke:var(--line);vector-effect:non-scaling-stroke}
.chart p{margin:8px 0 0;font-size:13px}
.tree-wrap,.t-wrap{overflow-x:auto}
.tree{min-width:760px}
.tree-head,.tree-row>summary,.tree-total{display:grid;grid-template-columns:minmax(260px,1fr) 90px 100px 80px 96px 36px;
  align-items:center;gap:8px;padding:11px 18px}
.tree-head{font-size:12px;color:var(--muted);border-bottom:1px solid var(--line)}
.tree-head span:not(.label),.tree-total span:not(.label),.tree-row .num,.tree-row .conv{text-align:right}
.tree-row>summary{list-style:none;cursor:pointer;border-bottom:1px solid var(--line)}
.tree-row>summary::-webkit-details-marker{display:none}
.tree-row.leaf>summary{cursor:default}
.tree-row>summary .label::before{content:"▸";display:inline-block;width:16px;color:var(--muted)}
.tree-row[open]>summary .label::before{content:"▾"}
.tree-row.leaf>summary .label::before{content:"";}
.tree-row.d1>summary{font-weight:600}
.tree-row.d2>summary .label{padding-left:18px}
.tree-row.d3>summary .label{padding-left:36px}
.tree-row.d4>summary .label{padding-left:54px}
.tree-row.d5>summary .label{padding-left:72px}
.tree-row .go{text-align:center;text-decoration:none;color:var(--muted)}
@media (hover:hover){.tree-row>summary:hover{background:rgba(127,140,160,.06)}.tree-row .go:hover{color:var(--blue)}}
.tree-total{font-weight:700}
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:-6px 0 16px}
.pill{display:inline-block;font-size:13px;padding:6px 12px;border-radius:var(--radius-pill);border:1px solid var(--line);
  text-decoration:none;color:var(--muted)}
.pill.on{color:var(--text);background:var(--card);border-color:var(--text)}
.reset{font-size:13px;color:var(--muted)}
table.list{width:100%;min-width:760px;border-collapse:collapse;font-size:14px}
.list th,.list td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--line)}
.list th{font-size:12px;color:var(--muted);font-weight:600}
.list tr:last-child td{border-bottom:0}
.list .n{text-align:right}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;padding:18px 20px}
.facts span{display:block;color:var(--muted);font-size:13px;margin-bottom:4px}
.facts b{font-size:17px}
.devices{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.device{padding:14px 16px;display:flex;flex-direction:column;gap:6px;font-size:14px}
.device .kind b{margin-right:6px}
.device code{font-size:12px;color:var(--muted);word-break:break-all}
.merge{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;margin-bottom:10px;font-size:14px}
.feed{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.visit{padding:14px 18px}
.visit-top{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline}
.visit-top time{margin-left:auto;color:var(--muted);font-size:14px}
.visit-meta{display:flex;flex-wrap:wrap;gap:4px 16px;color:var(--muted);font-size:13px;margin-top:6px}
.path{margin-top:8px;font-size:13px;word-break:break-word}
.goals{margin-top:8px;display:flex;gap:6px;flex-wrap:wrap}
.login{max-width:380px;margin:48px auto;padding:28px;display:flex;flex-direction:column;gap:14px}
.login h1{font-size:22px}
.login label{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--muted)}
.login .err{color:#d33;margin:0}
@media (max-width:640px){
  .top{padding:14px 64px 6px 16px;gap:12px}
  .wrap{padding:8px 16px 40px}
  h1{font-size:24px}
  .kpi b{font-size:24px}
  .kpis{grid-template-columns:1fr 1fr;gap:10px}
  .kpi{padding:14px}
  /* Список посетителей на телефоне — карточками, а не широкой таблицей */
  .t-wrap{overflow:visible;background:none;border:0;box-shadow:none}
  table.list{min-width:0}
  .list thead{display:none}
  .list tr{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;padding:14px 16px;margin-bottom:10px;
    background:var(--card);border:1px solid var(--line);border-radius:var(--radius-card)}
  .list td{padding:0;border:0}
  .list td.who{grid-column:1/-1;font-weight:600}
  .list td[data-label]::before{content:attr(data-label);display:block;font-size:12px;color:var(--muted)}
  .list .n{text-align:left}
  /* Источники на телефоне: название строкой, цифры под ним — без горизонтальной прокрутки */
  .tree-wrap{overflow:visible}
  .tree{min-width:0}
  .tree-head{display:none}
  .tree-row>summary,.tree-total{grid-template-columns:repeat(4,1fr) 28px;row-gap:4px;padding:12px 14px}
  .tree-row>summary .label,.tree-total .label{grid-column:1/-1}
  .tree-row .num,.tree-row .conv,.tree-total span:not(.label){text-align:left;font-size:14px}
  .tree-row .num::before,.tree-row .conv::before,.tree-total span[data-label]::before{display:block;font-size:11px;
    color:var(--muted);font-weight:400}
  .tree-row .num:nth-of-type(2)::before{content:"Визиты"}
  .tree-row .num:nth-of-type(3)::before{content:"Посетители"}
  .tree-row .num:nth-of-type(4)::before{content:"Заявки"}
  .tree-row .conv::before{content:"Конверсия"}
  .tree-total span[data-label]::before{content:attr(data-label)}
  .tree-row.d2>summary .label{padding-left:12px}
  .tree-row.d3>summary .label{padding-left:24px}
  .tree-row.d4>summary .label{padding-left:36px}
  .tree-row.d5>summary .label{padding-left:48px}
}