.ma { --ma-ink:#18232d; --ma-muted:#677785; --ma-line:#dce3e8; --ma-accent:#155eef; --ma-good:#16754a; color:var(--ma-ink); min-width:0; padding:16px; }
.ma *, .ma *::before, .ma *::after { box-sizing:border-box; }
.ma-toolbar { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:14px; background:#fff; border:1px solid var(--ma-line); border-radius:14px; margin-bottom:16px; }
.ma-control { min-width:0; display:flex; flex-direction:column; gap:5px; font-size:11px; font-weight:700; color:var(--ma-muted); }
.ma-control select,.ma-control input { width:100%; min-width:0; max-width:100%; height:42px; border:1px solid var(--ma-line); border-radius:8px; padding:8px 10px; background:#fff; color:var(--ma-ink); font-size:13px; font-weight:500; }
.ma-control input::-webkit-date-and-time-value { text-align:left; min-width:0; }
.ma-control input:focus,.ma-control select:focus,.ma-button:focus-visible { outline:2px solid var(--ma-accent); outline-offset:2px; }
.ma-control.ma-wide { grid-column:span 2; }
.ma-button { min-height:42px; padding:10px 14px; border-radius:9px; border:1px solid var(--ma-line); background:#fff; color:var(--ma-ink); font:inherit; cursor:pointer; }
.ma-button-primary { background:var(--ma-accent); border-color:var(--ma-accent); color:#fff; font-weight:700; }
.ma-button:disabled { opacity:.45; cursor:default; }
.ma-period { display:flex; flex-wrap:wrap; gap:7px 14px; justify-content:space-between; margin:0 2px 14px; font-size:12px; color:var(--ma-muted); }
.ma-heading { margin:0 0 6px; font-size:23px; line-height:1.25; font-weight:800; letter-spacing:-.025em; overflow-wrap:anywhere; }
.ma-subtitle { margin:0 0 18px; color:var(--ma-muted); font-size:12px; line-height:1.6; }
.ma-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.ma-card { min-width:0; padding:18px; border:1px solid var(--ma-line); border-radius:14px; background:#fff; box-shadow:0 2px 4px #18232d04; }
.ma-card-primary { border-top:3px solid var(--ma-good); padding-top:16px; }
.ma-kpi-label { color:var(--ma-muted); font-size:11px; line-height:1.45; font-weight:700; min-height:31px; }
.ma-kpi-value { font-size:clamp(24px,3vw,36px); line-height:1.2; font-weight:800; letter-spacing:-.035em; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; margin:6px 0; }
.ma-kpi-note { color:var(--ma-muted); font-size:11px; line-height:1.55; overflow-wrap:anywhere; }
.ma-delta { display:inline-block; margin-right:5px; color:var(--ma-muted); font-weight:700; }
.ma-delta.good { color:var(--ma-good); }.ma-delta.bad { color:#a13d23; }
.ma-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-bottom:16px; }
.ma-grid > * { min-width:0; }
.ma-panel-title { font-size:15px; line-height:1.45; font-weight:800; margin:0 0 12px; overflow-wrap:anywhere; }
.ma-chart { width:100%; height:270px; min-width:0; position:relative; overflow:hidden; }
.ma-empty { min-height:140px; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:22px 12px; text-align:center; gap:8px; color:var(--ma-muted); font-size:13px; line-height:1.6; }
.ma-empty strong { color:var(--ma-ink); font-size:15px; }
.ma-notice { padding:12px 14px; margin-bottom:16px; border:1px solid #e5d9b3; border-radius:10px; background:#fffaf0; color:#705522; font-size:12px; line-height:1.6; overflow-wrap:anywhere; }
.ma-note { color:var(--ma-muted); font-size:11px; line-height:1.6; margin:10px 0 0; }
.ma-table-wrap { width:100%; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.ma-table { width:100%; table-layout:fixed; border-collapse:collapse; font-size:12px; }
.ma-table th { padding:10px 7px; text-align:left; color:var(--ma-muted); font-size:10px; font-weight:700; border-bottom:1px solid var(--ma-line); white-space:normal; overflow-wrap:anywhere; }
.ma-table td { padding:12px 7px; border-bottom:1px solid #edf0f3; vertical-align:top; line-height:1.5; overflow-wrap:anywhere; word-break:break-word; }
.ma-table th:first-child,.ma-table td:first-child { width:42%; }
.ma-table .num { text-align:right; font-variant-numeric:tabular-nums; }
.ma-table a { color:var(--ma-accent); text-decoration:none; }
.ma-table a:hover { text-decoration:underline; }
.ma-table small { display:block; font-size:10px; color:var(--ma-muted); font-weight:400; margin-top:3px; }
.ma-list { display:flex; flex-direction:column; gap:10px; }
.ma-list-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 12px; border-bottom:1px solid #edf0f3; padding:4px 0 12px; }
.ma-list-name { min-width:0; font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.ma-list-value { text-align:right; font-weight:800; font-size:13px; white-space:nowrap; }
.ma-list-sub { grid-column:1/-1; color:var(--ma-muted); font-size:11px; line-height:1.5; }
.ma-bar { grid-column:1/-1; height:4px; border-radius:2px; background:#edf1f7; overflow:hidden; }
.ma-bar span { display:block; height:100%; background:var(--ma-accent); border-radius:2px; max-width:100%; }
.ma-details { margin-top:12px; }.ma-details summary { cursor:pointer; min-height:36px; padding:8px 0; color:var(--ma-accent); font-size:12px; font-weight:700; }
.ma-pager { display:flex; gap:8px; justify-content:flex-end; align-items:center; margin-top:12px; font-size:11px; color:var(--ma-muted); }
.ma-page-detail { border-top:1px solid var(--ma-line); margin-top:16px; padding-top:16px; }
.ma-tag { display:inline-block; padding:3px 7px; border-radius:6px; font-size:10px; font-weight:700; background:#eef3fa; color:#37577b; margin:0 4px 4px 0; }
@media (max-width:700px) { .ma-toolbar { grid-template-columns:repeat(2,minmax(0,1fr)); }.ma-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }.ma-grid { grid-template-columns:minmax(0,1fr); }.ma { padding:12px; }.ma-card { padding:14px; }.ma-kpi-value { font-size:27px; }.ma-chart { height:240px; }.ma-table { font-size:11px; }.ma-table th,.ma-table td { padding-left:5px; padding-right:5px; } }
@media (max-width:350px) { .ma { padding:10px; }.ma-toolbar { padding:10px; gap:8px; }.ma-kpis { gap:8px; }.ma-kpi-value { font-size:24px; }.ma-card { padding:12px; }.ma-control select,.ma-control input { padding:8px 6px; font-size:12px; } }
@media (prefers-reduced-motion:reduce) { .ma * { scroll-behavior:auto !important; transition:none !important; } }
/* Source analytics v4: compact controls and data exploration in Telegram. */
.ma { padding:0; --ma-accent:#2e63a7; }
.ma-toolbar { display:block; padding:16px; }
.ma-choice { border:0; padding:0; margin:0 0 14px; min-width:0; }
.ma-choice legend { color:var(--ma-muted); font-size:11px; font-weight:700; margin:0 0 7px; }
.ma-choice-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
.ma-choice-options button { border:1px solid var(--ma-line); padding:9px 5px; background:#fff; border-radius:8px; color:var(--ma-muted); min-width:0; min-height:44px; font-size:12px; line-height:1.25; cursor:pointer; overflow-wrap:anywhere; }
.ma-choice-options button.selected { color:var(--ma-ink); border-color:#9ab0c6; background:#edf3f8; font-weight:750; }
.ma[data-source="yandex"] .ma-choice-options button[name="source"].selected { background:#fff5df; border-color:#dfbb63; }
.ma[data-source="google"] .ma-choice-options button[name="source"].selected { background:#edf3ff; border-color:#94afd5; }
.ma-filter-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-bottom:12px; }
.ma-control { min-width:0; }
.ma-control.ma-full { grid-column:1/-1; }
.ma-control select,.ma-control input { min-height:44px; height:44px; font-size:14px; padding:9px 30px 9px 10px; line-height:1.3; box-sizing:border-box; }
.ma-control input { padding-right:10px; }
.ma-source-heading { font-size:15px; font-weight:750; margin:0 0 15px; }
.ma-context { color:var(--ma-muted); font-size:11px; line-height:1.7; margin:0 2px 12px; overflow-wrap:anywhere; }
.ma-kpis { grid-template-columns:repeat(3,minmax(0,1fr)); }
.ma-kpi { container-type:inline-size; }
.ma-kpi-value { font-size:clamp(20px,16cqw,34px); overflow-wrap:normal; white-space:nowrap; letter-spacing:-.04em; }
.ma-card,.ma-explore { min-width:0; }
.ma-panel { margin:0 0 16px; }
.ma-grid > .ma-panel { margin-bottom:0; }
.ma-local { margin-bottom:10px; max-width:360px; }
.ma-empty { min-height:60px; font-size:12px; padding:12px 4px; }
.ma-notice { margin-top:0; }
.ma-rank-main { display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.ma-rank-main .ma-delta { font-size:26px; flex-shrink:0; }
.ma-rank-main > span:last-child { color:var(--ma-muted); font-size:12px; line-height:1.4; }
.ma-mini-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.ma-mini-grid b { display:block; font-size:20px; font-variant-numeric:tabular-nums; }
.ma-mini-grid span { display:block; font-size:11px; color:var(--ma-muted); }
.ma-section-label { margin:0 0 12px; font-weight:750; font-size:16px; }
.ma-funnel { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:8px; align-items:center; padding:14px 0; }
.ma-funnel + .ma-funnel { border-top:1px solid var(--ma-line); }
.ma-funnel b { display:block; font-size:22px; font-variant-numeric:tabular-nums; }
.ma-funnel span { display:block; font-size:11px; line-height:1.5; color:var(--ma-muted); }
.ma-funnel-rate { font-weight:750; font-size:12px; color:#268064; white-space:nowrap; }
.ma-table-controls { display:grid; grid-template-columns:minmax(150px,1fr) auto auto; gap:8px; margin:12px 0; align-items:end; }
.ma-table-controls > .ma-control:last-child { width:82px; }
.ma-table-controls input,.ma-table-controls select { font-size:12px; }
.ma-table { table-layout:auto; }
.ma-table-wide { min-width:720px; }
.ma-table th:first-child,.ma-table td:first-child { width:auto; min-width:110px; max-width:300px; }
.ma-table-wide th:first-child,.ma-table-wide td:first-child { min-width:210px; }
.ma-table th button { all:unset; cursor:pointer; min-height:36px; display:inline-block; font:inherit; }
.ma-table td.num { white-space:nowrap; word-break:normal; }
.ma-url { border:0; padding:4px 0; background:none; color:var(--ma-accent); font:inherit; line-height:1.5; text-align:left; cursor:pointer; overflow-wrap:anywhere; }
.ma-url:hover { text-decoration:underline; }
.ma-pager { flex-wrap:wrap; gap:6px; justify-content:flex-end; }
.ma-pager > span { margin-right:auto; }
.ma-pager .ma-button { min-width:44px; padding:8px; }
.ma-dialog { width:min(1000px,calc(100vw - 24px)); max-width:calc(100vw - 24px); max-height:calc(100dvh - 32px - var(--app-safe-top,0px) - var(--app-safe-bottom,0px)); margin:auto; padding:0; border:1px solid var(--ma-line); border-radius:14px; background:#f5f7fa; color:var(--ma-ink); box-sizing:border-box; overflow:auto; }
.ma-dialog::backdrop { background:#14233899; }
.ma-dialog-header { position:sticky; top:0; z-index:2; display:flex; align-items:flex-start; gap:12px; padding:14px; background:#fff; border-bottom:1px solid var(--ma-line); }
.ma-dialog-header > div { flex:1; min-width:0; overflow-wrap:anywhere; font-size:14px; }
.ma-dialog-header small { display:block; font-size:11px; color:var(--ma-muted); margin-top:5px; }
.ma-dialog-header > button { flex-shrink:0; font-size:22px; line-height:1; min-width:44px; }
.ma-dialog-body { padding:14px; }
.ma-dialog-body > .ma-note { margin:0 0 14px; }
.ma-external { display:inline-flex; text-decoration:none; }
@media(max-width:700px) { .ma {padding:0;} .ma-kpis {grid-template-columns:repeat(2,minmax(0,1fr));} .ma-card {padding:14px;} .ma-grid {gap:12px;} .ma-table-controls {grid-template-columns:minmax(0,1fr) 82px;} .ma-table-search {grid-column:1/-1;} .ma-table-controls > .ma-control:last-child {grid-column:2;} .ma-toolbar {padding:12px;} .ma-choice-options button {font-size:12px;} }
@media(max-width:380px) { .ma-filter-grid {grid-template-columns:minmax(0,1fr);} .ma-control select {font-size:13px;} .ma-funnel {grid-template-columns:minmax(0,1fr) 60px minmax(0,1fr);gap:5px;} .ma-funnel-rate {white-space:normal;font-size:11px;} .ma-card {padding:12px;} .ma-dialog-body {padding:10px;} }

.ma-dialog { --ma-line:#dce3e8; --ma-ink:#17242e; --ma-muted:#607080; --ma-accent:#2e63a7; --ma-good:#16754a; }
/* One query registry and one URL registry; scroll remains inside each table. */
.ma-registry-table { min-width:1240px; }
.ma-registry-table th,.ma-registry-table td { min-width:76px; }
.ma-registry-table th:first-child,.ma-registry-table td:first-child { position:sticky;left:0;z-index:1;min-width:190px;max-width:240px;background:#fff;box-shadow:2px 0 3px #17242e10; }
.ma-registry-table th:first-child { z-index:2; }
.ma-registry-table th button:focus-visible,.ma-url:focus-visible { outline:2px solid var(--ma-accent);outline-offset:2px; }
.ma-sort-indicator { display:inline-block;min-width:12px;color:var(--ma-accent); }
.ma-table [aria-sort="ascending"],.ma-table [aria-sort="descending"] { color:var(--ma-accent);background:#f1f6fd; }
.ma-observation { display:flex;justify-content:flex-end;align-items:center;gap:5px;min-height:23px;white-space:nowrap; }
.ma-observation span { font-size:10px;color:var(--ma-muted); }
.ma-pages-link { margin:0 0 12px; }.ma-pages-link a { color:var(--ma-accent);font-weight:700; }
.ma-query-page { font-size:10px; }
.ma-speed-devices { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px; }.ma-speed-devices>div { min-width:0; }.ma-speed-devices .ma-button { font-size:12px;margin-top:8px;max-width:100%; }
@media(max-width:600px) { .ma-registry-table th:first-child,.ma-registry-table td:first-child { min-width:142px;max-width:160px; }.ma-speed-devices { grid-template-columns:minmax(0,1fr); } }
.ma-with-speed{grid-template-columns:minmax(160px,1fr) minmax(130px,170px) auto 82px}.ma-speed-poor{color:#b42318}.ma-speed-flags{white-space:normal;max-width:180px}.ma-speed-flags .ma-tag{white-space:normal;color:#8c4020;background:#fff1e8}
@media(max-width:700px){.ma-with-speed{grid-template-columns:minmax(0,1fr) 82px}.ma-speed-filter{grid-column:1/-1}}
