:root {
--bg:#090a0d;
--panel:#13161c;
--panel2:#1b1f27;
--line:#2b303a;
--text:#f5f6f8;
--muted:#a4aab7;
--red:#e32833;
--brand:#d20a17;
--redt:#ff5a63;
--reds:#391419;
--ok:#46c969;
--warn:#e1c58f;
--info:#6cb4ff;
--chart-series:#c91f2a;--chart-series-hover:#f04a54;
--red2:#391419;
--radius:12px;
--control-radius:10px;
--panel-padding:18px;
--control-height:40px}
* {
box-sizing:border-box}
body {
margin:0;
background:var(--bg);
color:var(--text);
font:14px/1.45 Inter,system-ui,"Segoe UI",sans-serif}
body::before {
content:"";
position:fixed;
inset:0;
background:url('../assets/wolfmountain-racing-logo-transparent.png?v=20260926') center/contain no-repeat;
opacity:.025;
pointer-events:none;z-index:0}
.app {
min-height:100vh;
display:grid;
grid-template-columns:224px minmax(0,1fr);position:relative;
z-index:1}
aside {
padding:22px 12px;
background:#0d0f14;
border-right:1px solid var(--line)}
.brand {
display:grid;
justify-items:center;
gap:7px;
margin:0 4px 24px;
text-align:center}
.brand img {
display:block;
width:auto;
max-width:195px;
max-height:150px;
height:auto;
object-fit:contain}
.brand small {
color:var(--muted);
font-size:11px;
font-weight:700;
letter-spacing:.08em;
text-transform:uppercase}
nav {
display:grid;
gap:5px}
button,input,select {
font:inherit}
button {
color:var(--text);
border:1px solid var(--line);
background:var(--panel2);
border-radius:var(--control-radius);
min-height:var(--control-height);
padding:9px 12px;
cursor:pointer}
button:hover,button:focus-visible {
border-color:var(--red);
outline:2px solid #e3283366}
nav button,nav a {
border:0;
background:transparent;
text-align:left;
color:var(--muted)}
nav a {
display:block;
border-radius:var(--control-radius);
min-height:var(--control-height);
padding:9px 12px;
cursor:pointer;
text-decoration:none}
nav a:focus-visible {
border-color:var(--red);
outline:2px solid #e3283366}
nav button.active,nav button:hover,nav a.active,nav a:hover {
background:var(--red2);
color:#fff}
main {
width:min(1440px,100%);
margin:auto;
padding:26px}
.top {
display:flex;
justify-content:space-between;
gap:16px;
align-items:center;
min-height:48px}
.top h1 {
margin:0;
font-size:24px;
line-height:1.15;
letter-spacing:-.02em}
.status {
color:var(--muted);
font-size:12px;
line-height:1.4;
margin-top:5px}
.tools {
display:flex;
gap:8px;
align-items:center;
flex-wrap:wrap}
input,select {
color:var(--text);
background:var(--panel);
border:1px solid var(--line);
border-radius:var(--control-radius);
min-height:var(--control-height);
padding:9px 11px}
.refresh {
background:var(--red);
border-color:var(--red)}
section {
margin-top:24px}
.hidden {
display:none!important}
.cards {
display:grid;
grid-template-columns:repeat(auto-fit,minmax(155px,1fr));
gap:12px}
.card,.panel {
background:var(--panel);
border:1px solid var(--line);
border-radius:var(--radius);
padding:var(--panel-padding);
box-shadow:none}
.cards>.card,.grid>.panel,.profile-grid>.panel {
height:100%}
.cards>.card {
min-width:0;
min-height:112px;
display:flex;
flex-direction:column;
justify-content:center;
overflow:hidden}
.card .label {
font-size:clamp(10px,.72vw,11px);
line-height:1.3;
color:var(--muted);
text-transform:uppercase;
letter-spacing:.07em;
font-weight:600}
.num {
min-width:0;
font-size:clamp(17px,1.55vw,25px);
line-height:1.16;
font-weight:800;
margin-top:7px;
overflow:hidden;
overflow-wrap:anywhere;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2}
.num.person-value {font-size:clamp(15px,1.25vw,21px)}
.num.red {
color:var(--red)}
.grid {
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:14px;
margin-top:14px}
.panel h2,.panel h3 {
margin:0 0 13px;
font-size:15px;
line-height:1.25}
.list {
display:grid}
.row {
display:flex;
align-items:center;
gap:10px;
border-bottom:1px solid var(--line);
min-height:58px;
padding:11px 4px}
.row:last-child {
border:0}
.row .grow {
min-width:0;
flex:1}
.member-content {
min-width:0;
flex:1;
display:flex;
flex-direction:column;
gap:3px}
.member-name {
overflow:hidden;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
line-height:1.25}
.member-nickname,.row-meta {
color:var(--muted);
font-size:12px;
line-height:1.35}
.row-meta {
display:flex;
flex-wrap:wrap;
column-gap:6px;
row-gap:3px}
.muted {
color:var(--muted)}
small {
font-size:12px}
.clickable {
cursor:pointer;
border-radius:8px}
.clickable:hover,.clickable:focus-visible {
background:var(--red2);
outline:2px solid #e3283366;
outline-offset:-2px}
.details {
white-space:nowrap;
background:var(--red);
border-color:var(--red);
font-size:12px}
.avatar {
width:35px;
height:35px;
border-radius:50%;
object-fit:cover;
background:var(--red2);
flex:0 0 auto}
.avatar.large {
width:66px;
height:66px}
.badge {
display:inline-block;
background:#252a34;
color:#fff;
border:1px solid var(--line);
padding:3px 7px;
border-radius:999px;
font-size:11px;
margin:2px}
.online {
color:#5edb86}
.active {
color:#6ce59b}
.chart {
height:210px;
position:relative;
border-bottom:1px solid var(--line);
padding-left:46px;
background:repeating-linear-gradient(to top,transparent 0,transparent 51px,#2b303a55 52px)}
.chart-state {
position:absolute;
inset:0;
display:grid;
place-items:center;
padding:24px;
color:var(--muted);
text-align:center}
.chart-error {
color:#ff9da3}
.chart-scale {
position:absolute;
inset:8px auto 23px 0;
width:40px;
display:flex;
flex-direction:column;
justify-content:space-between;
color:var(--muted);
font-size:10px;
line-height:1;
text-align:right}
.chart-bars {
height:100%;
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:clamp(6px,1.5vw,16px);
padding:8px 8px 2px}
.chart-column {
height:100%;
min-width:0;
flex:1 1 0;
display:grid;
grid-template-rows:19px 1fr auto;
align-items:end;
gap:4px}
.chart-value {
min-height:15px;
color:var(--text);
font-size:10px;
font-weight:700;
line-height:1.1;
text-align:center;
white-space:nowrap}
.chart-bar-slot {
height:100%;
display:flex;
align-items:flex-end;
justify-content:center}
.chart-bar {
width:72%;
max-width:36px;
min-width:12px;
margin:0 auto;
background:var(--chart-series);
border-radius:4px 4px 0 0;
transition:height .18s ease,background-color .18s ease,filter .18s ease}
.chart-bar:hover {
background:var(--chart-series-hover);
filter:brightness(1.08)}
.chart-label {
color:var(--muted);
font-size:10px;
line-height:1.1;
white-space:nowrap;
text-align:center;
overflow:hidden;
text-overflow:ellipsis}
.chart-column.today .chart-label {
color:var(--red);
font-weight:800}
@media(max-width:500px) {
.chart {
height:190px;
padding-left:35px}
.chart-scale {
width:30px;
font-size:9px}
.chart-bars {
gap:3px;
padding-inline:2px}
.chart-value {
font-size:9px}
.chart-bar {
min-width:0;
max-width:24px}
}
.profile-head {
display:flex;
gap:15px;
align-items:center;
flex-wrap:wrap}
.profile-hero {
position:relative;
overflow:hidden;
padding:28px;
background:radial-gradient(circle at 12% 0,#a9172033,transparent 38%),linear-gradient(135deg,var(--panel2),var(--panel))}
.profile-hero::after {
content:"";
position:absolute;
inset:0;
pointer-events:none;
background:linear-gradient(90deg,transparent,#ffffff08,transparent)}
.profile-hero .profile-head {position:relative;z-index:1}
.profile-hero .avatar.large {width:112px;height:112px;border:4px solid #ffffff18;box-shadow:0 14px 35px #0008}
.presence {display:inline-flex;align-items:center;gap:7px;width:max-content;font-weight:700}
.presence::before {content:"";width:9px;height:9px;border-radius:50%;background:#72767d;box-shadow:0 0 0 3px #72767d22}
.presence.online::before {background:#3ba55c;box-shadow:0 0 0 3px #3ba55c22}
.presence.idle::before {background:#faa61a;box-shadow:0 0 0 3px #faa61a22}
.presence.dnd::before {background:#ed4245;box-shadow:0 0 0 3px #ed424522}
.profile-kpi-groups {display:grid;gap:18px;margin:18px 0}
.profile-kpi-group {padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:#0b0c0f70}
.profile-kpi-group h3 {margin:0 0 12px;font-size:14px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.profile-kpi-group .kpis {margin:0}
.profile-charts {grid-template-columns:repeat(3,minmax(0,1fr))}
.profile-charts .chart {height:300px}
.activity-timeline {position:relative;display:grid;gap:0;padding-left:18px}
.activity-timeline::before {content:"";position:absolute;left:5px;top:10px;bottom:10px;width:2px;background:var(--line)}
.timeline-event {position:relative;display:grid;gap:3px;padding:9px 0 9px 14px}
.timeline-event::before {content:"";position:absolute;left:-17px;top:15px;width:8px;height:8px;border-radius:50%;background:var(--red);box-shadow:0 0 0 4px var(--panel)}
.team-kpis {display:grid;grid-template-columns:repeat(3,minmax(145px,1fr));gap:10px}
.team-kpi {padding:15px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(145deg,var(--panel2),var(--panel))}
.team-kpi small,.team-kpi strong {display:block}.team-kpi strong {margin-top:6px;font-size:19px}
.team-timeline {position:relative;display:grid;padding-left:20px}
.team-timeline .timeline-event {padding-block:12px}
.dashboard-status {display:grid;grid-column:1/-1;grid-template-columns:repeat(4,minmax(140px,1fr));gap:10px;margin-bottom:14px}
.control-status{display:flex;align-items:center;gap:8px;min-height:34px;margin-bottom:12px;padding:7px 11px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:12px;background:#101319;overflow:hidden;white-space:nowrap}
.control-status.ok .status-dot{background:#55cf7c}.control-status.warn{color:#ffd166;border-color:#8b6b28}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--red);flex:none}
.executive-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(125px,1fr));gap:10px}.executive-kpis .card{min-height:104px;padding:14px}.executive-kpis .num{font-size:clamp(22px,1.8vw,26px);letter-spacing:-.02em;font-variant-numeric:tabular-nums}.kpi-detail{margin-top:6px;color:var(--muted);font-size:11px;line-height:1.35}.delta{font-weight:750}.delta.up{color:#65d98a}.delta.down{color:#ff8b91}.delta.flat{color:var(--muted)}
.control-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px}.lead-grid{grid-template-columns:minmax(280px,.75fr) minmax(430px,1.25fr)}.control-grid>.panel{min-width:0}.movement-summary{color:var(--muted);font-weight:700;margin:-5px 0 12px}.movement-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.movement-group{min-width:0;padding:11px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}.movement-group h3{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.movement-item{display:flex;gap:7px;align-items:center;padding:7px 0;border-top:1px solid var(--line);cursor:pointer}.movement-item:first-of-type{border-top:0}.movement-item .avatar{width:27px;height:27px}.movement-item span{min-width:0}.movement-item b,.movement-item small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.live-voice-panel{margin-top:14px}.compact-voice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:10px}.compact-voice-channel{padding:11px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}.compact-voice-channel h3{display:flex;justify-content:space-between;margin:0 0 9px}.voice-people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.voice-chip{display:flex;align-items:center;gap:7px;min-width:0}.voice-chip .avatar{width:25px;height:25px}.voice-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.insight-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}.insight-head h2{margin:0}.insight-value{font-size:23px;font-weight:800}.insight-meta{display:flex;flex-wrap:wrap;gap:5px 12px;color:var(--muted);font-size:12px}.ranking-item{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px 0;cursor:pointer}.ranking-track{grid-column:2/4;height:4px;border-radius:4px;background:#292e37;overflow:hidden}.ranking-fill{display:block;height:100%;background:#b92630}.team-activity-value{font-size:28px;font-weight:850}.activity-meter{height:8px;margin:10px 0;border-radius:9px;background:#292e37;overflow:hidden}.activity-meter span{display:block;height:100%;background:#58c77a}.summary-note{margin-top:14px;padding:12px;border-top:1px solid var(--line);color:var(--muted)}
@media(max-width:1180px){.executive-kpis{grid-template-columns:repeat(4,minmax(130px,1fr))}}
@media(max-width:820px){.lead-grid,.control-grid{grid-template-columns:1fr}.executive-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.movement-columns{grid-template-columns:1fr 1fr}}
@media(max-width:520px){main{padding:14px}.executive-kpis{gap:8px}.executive-kpis .card{padding:11px;min-height:94px}.movement-columns,.voice-people{grid-template-columns:1fr}.control-status{border-radius:10px;white-space:normal;flex-wrap:wrap}.compact-voice-grid{grid-template-columns:1fr}}
.status-card {min-width:0;min-height:94px;padding:13px 15px;border:1px solid var(--line);border-radius:10px;background:var(--panel2);overflow:hidden}
.status-card small,.status-card b {display:block;min-width:0}.status-card b {margin-top:5px;font-size:clamp(14px,1.1vw,18px);line-height:1.2;overflow:hidden;text-overflow:ellipsis}
.status-card .status-secondary {margin-top:5px;font-size:clamp(10px,.72vw,12px);line-height:1.3;color:var(--muted);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.active-voice-card {grid-column:1/-1}
.voice-channel-groups {display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.voice-channel-card {padding:14px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}
.voice-channel-card h3 {margin:0 0 10px;font-size:15px}
.voice-person {display:flex;align-items:center;gap:9px;padding:7px 0;border-top:1px solid var(--line)}
.voice-person:first-of-type {border-top:0}
.voice-person .avatar {width:30px;height:30px}
.profile-head h2 {
margin:0}
.profile-actions {
display:flex;
justify-content:space-between;
align-items:center;
gap:12px;
margin-bottom:16px}
.profile-meta {
display:grid;
gap:4px;
margin-top:5px}
.profile-roles {
margin-top:12px}
.inactivity-state {
margin-left:auto;
min-width:220px;
border:1px solid var(--line);
border-radius:10px;
padding:12px;
background:var(--panel2)}
.inactivity-state.active {
color:#6ce59b}
.inactivity-state.warning {
color:var(--muted)}
.inactivity-state.critical {
color:var(--red)}
.inactivity-state b,.inactivity-state small {
display:block}
.kpis {
display:grid;
grid-template-columns:repeat(auto-fit,minmax(155px,1fr));
gap:9px;
margin:16px 0}
.member-profile-page {
max-width:1280px;
margin-inline:auto}
.member-profile-page,
.member-profile-page section,
.member-profile-page .profile-grid,
.member-profile-page .profile-kpi-groups,
.member-profile-page .profile-kpi-group,
.member-profile-page .panel,
.member-profile-page .trend-chart-wrap,
.member-profile-page .chart {
min-width:0;
max-width:100%}
.member-profile-page .trend-chart-wrap,
.member-profile-page .chart {
overflow:hidden}
.profile-actions {
min-width:0;
flex-wrap:wrap}
.profile-actions small {
min-width:0;
overflow-wrap:anywhere}
.kpi {
background:var(--panel2);
border:1px solid var(--line);
border-radius:var(--radius);
padding:16px;
min-height:88px;
box-shadow:none}
.kpi b {
display:block;
font-size:clamp(14px,1.05vw,17px);
line-height:1.2;
margin-top:4px;
overflow:hidden;
overflow-wrap:anywhere;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2}
.section-title {
margin-top:18px!important;
font-size:13px!important;
text-transform:uppercase;
color:var(--muted);
letter-spacing:.05em}
.profile-grid {
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:14px;
margin-top:14px}
.profile-panel {
height:100%}
.profile-table {
display:grid}
.profile-table .row {
align-items:flex-start}
.profile-table .row>span:first-child {
min-width:0;
flex:1}
.channel-audit-table {
overflow-x:auto}
.member-records textarea {
width:100%;
box-sizing:border-box;
margin:8px 0 12px;
padding:12px;
border:1px solid var(--line);
border-radius:10px;
background:var(--panel);
color:var(--text);
resize:vertical}
.note-row {
align-items:flex-start}
.note-row p {
margin:8px 0 0;
white-space:pre-wrap}
.channel-audit-row {
display:grid;
grid-template-columns:minmax(150px,1fr) minmax(180px,1.2fr) 120px minmax(150px,1fr) minmax(210px,1.3fr);
gap:12px;
align-items:center;
padding:12px 14px;
border-bottom:1px solid var(--line)}
.channel-audit-row.header {
color:var(--muted);
font-size:12px;
font-weight:700;
text-transform:uppercase;
letter-spacing:.04em}
.channel-audit-row>span {
min-width:0;
overflow-wrap:anywhere}
@media(max-width:780px) {
.channel-audit-row {
min-width:860px}}
.trend-controls {
margin-bottom:14px}
.trend-grid {
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:14px}
.trend-chart-wrap {
overflow-x:auto;
overflow-y:hidden}
.trend-chart {
min-width:100%}
.longterm-summary {
margin-bottom:22px}
.comparison-sections {
display:grid;
gap:24px;
margin:20px 0 28px}
.comparison-section {
display:grid;
gap:12px}
.comparison-heading {
display:flex;
align-items:center;
gap:10px;
margin:0;
font-size:18px}
.comparison-heading span {
display:grid;
place-items:center;
width:34px;
height:34px;
border-radius:9px;
background:var(--red2)}
.comparison-grid {
display:grid;
grid-template-columns:repeat(3,minmax(220px,1fr));
gap:12px}
.comparison-card {
display:grid;
grid-template-rows:auto 1fr;
min-height:214px;
padding:17px;
border:1px solid var(--line);
border-radius:var(--radius);
background:linear-gradient(145deg,var(--panel2),var(--panel))}
.comparison-period {
margin-bottom:13px;
font-size:12px;
font-weight:700;
letter-spacing:.08em;
text-transform:uppercase;
color:var(--muted)}
.comparison-values {
display:grid;
grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
align-items:start;
gap:12px}
.comparison-side {
min-width:0}
.comparison-side.previous {
text-align:right}
.comparison-side small {
display:block;
margin-bottom:5px;
color:var(--muted)}
.comparison-main {
font-size:23px;
font-weight:800;
line-height:1.15}
.comparison-arrow {
padding-top:27px;
color:var(--line)}
.comparison-delta {
grid-column:1/-1;
align-self:end;
margin-top:18px;
padding-top:14px;
border-top:1px solid var(--line)}
.comparison-delta strong {
display:block;
font-size:18px;
line-height:1.25}
.comparison-delta small {
display:block;
margin-top:4px;
color:var(--muted)}
.comparison-note {
font-size:14px!important;
font-weight:650}
.activity-secondary {
display:block;
margin-top:7px;
font-size:12px;
color:var(--muted)}
.longterm-charts {
grid-template-columns:repeat(2,minmax(0,1fr));
gap:18px;
margin-bottom:28px}
.longterm-chart-panel {
padding:22px;
min-width:0;
max-width:100%}
.longterm-charts,#trends {
min-width:0;
max-width:100%}
.longterm-chart-panel h2 {
margin-bottom:18px}
.longterm-chart-panel .trend-chart-wrap {
min-height:390px}
.longterm-chart-panel .chart {
height:390px;
font-size:15px}
.longterm-chart-panel .chart-label,
.longterm-chart-panel .chart-value {
font-size:12px}
.longterm-chart-panel .chart-column {
position:relative}
.longterm-chart-panel .chart-column[data-tooltip]::after {
content:attr(data-tooltip);
position:absolute;
left:50%;
bottom:calc(100% - 24px);
z-index:5;
width:max-content;
max-width:240px;
padding:10px 12px;
border:1px solid var(--line);
border-radius:8px;
background:#08090c;
box-shadow:0 10px 28px #000a;
color:var(--text);
font-size:13px;
font-weight:650;
line-height:1.4;
opacity:0;
pointer-events:none;
transform:translate(-50%,6px);
transition:opacity .15s ease,transform .15s ease}
.longterm-chart-panel .chart-column[data-tooltip]:hover::after,
.longterm-chart-panel .chart-column[data-tooltip]:focus-within::after {
opacity:1;
transform:translate(-50%,0)}
.records-panel {
margin-bottom:18px}
.record-groups {
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:18px}
.record-group {
padding:16px;
border:1px solid var(--line);
border-radius:var(--radius);
background:var(--panel2)}
.record-group h3 {
margin:0 0 8px}
.record-item {
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:14px;
padding:11px 0;
border-top:1px solid var(--line)}
.record-item:first-of-type {
border-top:0}
.record-item span {
display:grid;
gap:3px}
.record-item strong {
text-align:right}
.comparison-value {
display:flex;
align-items:center;
gap:8px}
.trend-up {
color:#6ce59b}
.trend-down {
color:var(--red)}
.trend-flat {
color:var(--muted)}
.empty,.error {
padding:18px;
color:var(--muted);
text-align:center}
.error {
color:#ffadb3}
.voice-group {
margin:12px 0;
border:1px solid var(--line);
border-radius:9px;
padding:0 12px}
.relative {
white-space:nowrap;
font-size:12px;
color:var(--muted)}
.search {
width:min(430px,100%);
margin-bottom:12px}
@media(max-width:1180px) {
.comparison-grid {
grid-template-columns:repeat(2,minmax(220px,1fr))}
.longterm-charts {
grid-template-columns:1fr}
.profile-charts {grid-template-columns:1fr}
}
@media(max-width:820px) {
.app {
grid-template-columns:minmax(0,1fr)}
aside {
border-right:0;
border-bottom:1px solid var(--line);
padding:12px}
.brand {
margin:0 auto 12px}
.brand img {
max-width:170px;
max-height:132px}
nav {
display:flex;
overflow:auto}
nav button,nav a {
white-space:nowrap}
.top {
align-items:flex-start;
flex-direction:column}
.grid {
grid-template-columns:1fr}
main {
padding:16px}
.kpis {
grid-template-columns:repeat(3,minmax(130px,1fr))}
.profile-grid {
grid-template-columns:1fr}
.trend-grid {
grid-template-columns:1fr}
.comparison-grid {
grid-template-columns:repeat(2,minmax(210px,1fr))}
.longterm-charts,
.record-groups {
grid-template-columns:1fr}
.inactivity-state {
width:100%;
margin-left:0}
.team-kpis,.dashboard-status {grid-template-columns:repeat(2,minmax(130px,1fr))}
}
@media(max-width:500px) {
.row {
align-items:flex-start}
.details {
padding:7px}
.comparison-grid {
grid-template-columns:1fr}
.comparison-card {
min-height:196px}
.comparison-main {
font-size:20px}
.longterm-chart-panel {
padding:15px}
.longterm-chart-panel .trend-chart-wrap,
.longterm-chart-panel .chart {
min-height:330px;
height:330px}
.top h1 {
font-size:21px}
.kpis {
grid-template-columns:1fr}
.team-kpis,.dashboard-status {grid-template-columns:1fr}
.profile-hero {padding:18px}
}
.ticket-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.ticket-form label,.panel>label{display:flex;flex-direction:column;gap:7px;margin:10px 0}.ticket-form textarea{min-height:180px;resize:vertical}.ticket-form select[multiple]{min-height:180px}.ticket-message{border-left:3px solid #d20a17;padding:10px 14px;margin:10px 0;background:#111}.ticket-message small{display:block;color:#aaa;margin-bottom:6px}.ticket-attachment{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #292929}@media(max-width:760px){.ticket-form{grid-template-columns:1fr}}
.admin-filters{display:grid;grid-template-columns:2fr repeat(5,minmax(120px,1fr));gap:10px;margin-bottom:14px}.admin-actions{display:flex;gap:8px;flex-wrap:wrap}.danger{background:#76131a!important;border-color:#b91d28!important}.status-badge{display:inline-block;padding:2px 8px;border-radius:999px;background:#292929}.note-row p{white-space:pre-wrap}@media(max-width:900px){.admin-filters{grid-template-columns:1fr 1fr}}@media(max-width:600px){.admin-filters{grid-template-columns:1fr}}
.note-edit-dialog{width:min(760px,calc(100vw - 32px));max-height:calc(100vh - 32px);padding:0;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);color:var(--text);box-shadow:0 24px 80px #000c}.note-edit-dialog::backdrop{background:#000b}.note-edit-dialog form{display:grid;gap:14px;padding:22px}.note-edit-dialog h2{margin:0}.note-edit-dialog textarea{width:100%;min-height:320px;max-height:calc(100vh - 260px);resize:vertical;overflow:auto;white-space:pre-wrap}.note-edit-meta{display:flex;justify-content:space-between;gap:14px;align-items:center;flex-wrap:wrap}.note-edit-actions{display:flex;justify-content:flex-end;gap:10px}@media(max-width:600px){.note-edit-dialog{width:calc(100vw - 20px);max-height:calc(100vh - 20px)}.note-edit-dialog form{padding:16px}.note-edit-dialog textarea{min-height:250px;max-height:calc(100vh - 230px)}.note-edit-actions button{flex:1}}
.inactivity-toolbar{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:14px}.inactivity-toolbar h2{margin:0 0 5px}.inactivity-kpis{display:grid;grid-template-columns:repeat(7,minmax(110px,1fr));gap:9px}.inactivity-kpis .card{min-height:90px;padding:13px}.report-panel{margin-top:14px}.report-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;align-items:end}.report-controls>select,.report-controls>button{width:100%;min-width:0}.report-controls fieldset{display:flex;gap:12px;min-width:0;border:1px solid var(--line);border-radius:10px;flex-wrap:wrap}.report-controls label{white-space:nowrap}.inactivity-groups{display:grid;gap:16px;margin-top:16px}.inactivity-group{padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}.inactivity-group>summary{list-style:none;cursor:pointer}.inactivity-group>summary::-webkit-details-marker{display:none}.inactivity-group-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.inactivity-status-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}.inactivity-column{min-width:0;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}.inactivity-column h3{display:flex;justify-content:space-between}.driver-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;padding:10px 0;border-top:1px solid var(--line);cursor:pointer}.driver-card:first-of-type{border-top:0}.driver-card .avatar{width:30px;height:30px}.driver-card b,.driver-card small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.driver-stats{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px;color:var(--muted);font-size:11px}.status-accent-active{border-left:3px solid #55cf7c}.status-accent-watch{border-left:3px solid #e0aa3e}.status-accent-critical{border-left:3px solid var(--red)}@media(max-width:1100px){.inactivity-kpis{grid-template-columns:repeat(4,1fr)}.inactivity-status-columns{grid-template-columns:1fr 1fr}}@media(max-width:700px){.inactivity-toolbar{align-items:stretch;flex-direction:column}.inactivity-toolbar .tools{display:grid;grid-template-columns:1fr}.inactivity-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.report-controls,.inactivity-status-columns{grid-template-columns:1fr}.inactivity-group{padding:12px}}
.member-control-head{margin-bottom:10px}.member-control-head p{margin:0}.member-tabs{display:flex;gap:7px;overflow:auto;padding:2px 0 12px}.member-tabs button{white-space:nowrap;background:var(--panel);border:1px solid var(--line)}.member-tabs button.active{background:var(--red2);border-color:var(--red);color:#fff}.member-filter-shell{position:sticky;top:0;z-index:4;background:rgba(9,10,13,.96);backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:var(--radius);padding:12px;margin-bottom:12px}.member-search{width:100%;font-size:18px;min-height:48px;margin-bottom:10px}.member-filter-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:end}.member-filter-row>label,.member-role-filter{color:var(--muted);font-size:12px}.member-filter-row select{display:block;width:100%;margin-top:4px}.member-role-filter{min-width:0;margin:0;padding:8px 10px;border:1px solid var(--line);border-radius:10px}.member-role-filter legend{padding:0 4px;font-weight:700;color:var(--text)}.member-role-options,.member-role-mode,.member-active-filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:7px}.member-role-options label,.member-role-mode label,.filter-chip{border:1px solid var(--line);border-radius:999px;padding:6px 9px;background:var(--panel2);color:var(--text)}.member-former-toggle{display:flex;align-items:center;gap:8px;min-height:40px}.member-result-head{display:flex;align-items:center;justify-content:space-between;margin:10px 2px}.member-table-wrap{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.member-table{width:100%;border-collapse:collapse}.member-table thead{display:table-header-group}.member-table th{position:static;background:#181b22;text-align:left;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em}.member-table th,.member-table td{padding:11px 9px;border-bottom:1px solid var(--line);vertical-align:middle}.member-table tbody tr{cursor:pointer}.member-table tbody tr:hover{background:#1a1e26}.member-person{display:flex;align-items:center;gap:9px;min-width:190px}.member-person small{display:block}.member-badges{display:flex;gap:5px;flex-wrap:wrap}.member-pill{border:1px solid var(--line);border-radius:999px;padding:4px 7px;white-space:nowrap;font-size:12px}.member-pill.team{border-color:#d4aa42}.member-pill.rising{border-color:#8f76d8}.member-pill.active{border-color:#288861;color:#71d8ad}.member-pill.watch{border-color:#b47b25;color:#f5bc62}.member-pill.critical{border-color:#c33;color:#ff8585}.member-pill.unrated{border-color:#5376a7;color:#9bc2f5}.member-metrics{white-space:nowrap}.member-entry-link{white-space:nowrap;color:var(--muted)}.member-date{white-space:nowrap}.member-mobile{display:none}.profile-section-nav{position:sticky;top:0;z-index:5;display:flex;gap:7px;overflow:auto;background:rgba(9,10,13,.96);padding:9px 0}.profile-section-nav a{border:1px solid var(--line);border-radius:999px;padding:7px 10px;color:var(--text);text-decoration:none;white-space:nowrap}.profile-hero{border-top:3px solid var(--red)}
@media(max-width:1180px){.member-filter-row{grid-template-columns:repeat(2,minmax(0,1fr))}.member-table .member-secondary{display:none}}
@media(max-width:720px){.member-control-head{display:block}.member-kpis{justify-content:flex-start;margin-top:10px}.member-filter-shell{position:static}.member-filter-row{grid-template-columns:1fr 1fr}.member-table{display:none}.member-mobile{display:grid;gap:10px;padding:10px}.member-card{border:1px solid var(--line);border-radius:var(--radius);padding:13px;background:var(--panel);cursor:pointer}.member-card-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}.member-card-head .avatar{width:42px;height:42px}.member-card .member-badges{margin:7px 0}.member-card-stats{display:flex;gap:12px;flex-wrap:wrap;color:var(--muted);margin:8px 0}.member-card button{width:100%;margin-top:8px}.member-table-wrap{border:0}.member-control-head h1{font-size:25px}}
@media(max-width:460px){.member-filter-row{grid-template-columns:1fr}.member-kpi{font-size:12px;padding:5px 8px}}
.analysis-toolbar{display:grid;grid-template-columns:minmax(130px,.7fr) minmax(180px,1.2fr) repeat(3,minmax(140px,1fr)) auto;gap:9px;align-items:end;margin-bottom:14px}.analysis-toolbar label{font-size:12px;color:var(--muted)}.analysis-toolbar select,.analysis-toolbar input{display:block;width:100%;margin-top:4px}.analysis-kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:14px}.analysis-kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:13px}.analysis-kpi small{display:block;color:var(--muted);text-transform:uppercase;font-size:10px}.analysis-kpi strong{display:block;font-size:20px;margin-top:5px}.analysis-kpi span{font-size:11px;color:var(--muted)}.analysis-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,.85fr);gap:12px;margin-bottom:12px}.analysis-grid.equal{grid-template-columns:repeat(2,minmax(0,1fr))}.analysis-ranking,.analysis-channel-list{display:grid;gap:7px}.analysis-rank,.analysis-channel{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px;border-bottom:1px solid var(--line)}.analysis-channel{grid-template-columns:minmax(0,1fr) repeat(3,auto)}.analysis-rank button{all:unset;cursor:pointer;display:flex;align-items:center;gap:7px}.analysis-live-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.analysis-live-channel{border:1px solid var(--line);border-radius:10px;padding:10px}.analysis-live-members{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}.analysis-live-members span{background:var(--panel2);border-radius:999px;padding:5px 8px;font-size:12px}.analysis-table{width:100%;border-collapse:collapse}.analysis-table th,.analysis-table td{text-align:left;padding:9px;border-bottom:1px solid var(--line)}.analysis-table button{all:unset;cursor:pointer;font-weight:700}.analysis-mobile-cards{display:none}.delta-positive{color:#58c996!important}.delta-negative{color:#ef785f!important}@media(max-width:1050px){.analysis-toolbar{grid-template-columns:repeat(3,minmax(0,1fr))}.analysis-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.analysis-toolbar,.analysis-grid,.analysis-grid.equal,.analysis-live-groups{grid-template-columns:1fr}.analysis-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.analysis-table{display:none}.analysis-mobile-cards{display:grid;gap:8px}.analysis-member-card{border:1px solid var(--line);border-radius:10px;padding:10px}.analysis-channel{grid-template-columns:1fr 1fr}.analysis-channel strong{grid-column:1/-1}}
.analysis-page{min-width:0;overflow-x:hidden}.analysis-toolbar>*{min-width:0}@media(max-width:900px){.analysis-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}.analysis-grid,.analysis-grid.equal{grid-template-columns:1fr}.analysis-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.analysis-toolbar{grid-template-columns:1fr}}
.attention-group{padding:10px 0;border-bottom:1px solid var(--line)}.attention-group:last-child{border:0}.attention-group h3{display:flex;justify-content:space-between;gap:8px;margin:0 0 7px}.attention-entry{display:flex;justify-content:space-between;gap:10px;padding:6px 8px;border-radius:8px;cursor:pointer}.attention-entry:hover,.attention-entry:focus-visible{background:var(--panel2);outline:2px solid #e3283366}.attention-all{all:unset;color:#ff8b91;cursor:pointer;font-size:12px;font-weight:700}
.role-head{margin-bottom:12px}.role-head h2{margin:0}.role-kpis{grid-template-columns:repeat(4,minmax(125px,1fr));margin-bottom:14px}.role-filters{display:grid;grid-template-columns:minmax(180px,1.5fr) repeat(2,minmax(150px,1fr)) auto auto;gap:10px;align-items:center;margin-bottom:14px}.role-filters label{display:flex;gap:7px;align-items:center;white-space:nowrap}.role-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(260px,.7fr);gap:14px}.role-sim-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.role-sim-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--panel2);cursor:pointer}.role-sim-card:hover,.role-sim-card.active{border-color:var(--red);background:var(--red2)}.role-sim-card small{grid-column:1/-1;color:var(--muted)}.role-matrix-panel{margin-top:14px}.role-matrix-wrap{overflow:auto}.role-matrix{width:100%;border-collapse:collapse;min-width:580px}.role-matrix th,.role-matrix td{padding:10px;text-align:right;border-bottom:1px solid var(--line)}.role-matrix th:first-child,.role-matrix td:first-child{text-align:left}.role-matrix tbody tr{cursor:pointer}.role-matrix tbody tr:hover{background:var(--panel2)}.role-member-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.role-member{display:flex;align-items:center;gap:9px;padding:10px;border:1px solid var(--line);border-radius:10px;cursor:pointer}.role-member span{min-width:0}.role-member b,.role-member small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(max-width:900px){.role-filters{grid-template-columns:1fr 1fr}.role-layout{grid-template-columns:1fr}.role-member-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.role-kpis,.role-filters,.role-sim-grid,.role-member-grid{grid-template-columns:1fr}.role-filters>*{width:100%}}
.management-page{min-width:0;overflow-x:hidden}.management-tabs{display:flex;gap:7px;margin-bottom:14px;overflow:auto}.management-tabs button{white-space:nowrap;background:var(--panel);border:1px solid var(--line);color:var(--muted)}.management-tabs button.active{background:var(--red2);border-color:var(--red);color:#fff}.management-kpis{display:grid;grid-template-columns:repeat(5,minmax(120px,1fr));gap:10px;margin-bottom:14px}.management-kpis .card{min-height:92px;padding:13px}.management-filters{display:grid;grid-template-columns:minmax(220px,2fr) repeat(5,minmax(130px,1fr));gap:9px;align-items:center}.management-filters input,.management-filters select,.management-filters button{width:100%;min-width:0}.management-layout{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);gap:14px;margin-top:14px}.management-feed{display:grid}.management-event{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 4px;border-bottom:1px solid var(--line)}.management-event:last-child{border:0}.management-event-type{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:var(--panel2)}.management-event button{all:unset;cursor:pointer;font-weight:700}.management-event small{display:block;color:var(--muted);margin-top:3px}.management-chip{border:1px solid var(--line);border-radius:999px;padding:4px 7px;font-size:11px;color:var(--muted)}@media(max-width:1100px){.management-kpis{grid-template-columns:repeat(3,minmax(120px,1fr))}.management-filters{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.management-layout{grid-template-columns:1fr}.management-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.management-filters{grid-template-columns:1fr 1fr}.management-event{grid-template-columns:auto minmax(0,1fr)}.management-event>.management-chip{grid-column:2}}@media(max-width:480px){.management-kpis,.management-filters{grid-template-columns:1fr}.management-tabs{position:sticky;top:0;z-index:5;background:#090a0d;padding:8px 0}}
.statistics-page{min-width:0;overflow-x:hidden}.statistics-toolbar{display:grid;grid-template-columns:repeat(5,minmax(130px,1fr));gap:9px;margin-bottom:14px}.statistics-toolbar>*{min-width:0;width:100%}.statistics-custom.hidden{display:none}.statistics-sims{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--panel)}.statistics-sims label{display:flex;gap:5px;align-items:center}.statistics-kpis{display:grid;grid-template-columns:repeat(6,minmax(125px,1fr));gap:10px;margin-bottom:14px}.statistics-kpis .card{min-height:104px}.statistics-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px}.statistics-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.statistics-wide{grid-column:1/-1}.statistics-table-wrap{overflow-x:auto}.statistics-table{border-collapse:collapse;width:100%;min-width:650px}.statistics-table th,.statistics-table td{padding:9px;border-bottom:1px solid var(--line);text-align:right}.statistics-table th:first-child,.statistics-table td:first-child{text-align:left}.statistics-status{display:grid;gap:9px}.statistics-status-row{display:grid;grid-template-columns:140px minmax(0,1fr) auto;gap:8px;align-items:center}.statistics-status-track{height:10px;border-radius:999px;background:var(--panel2);overflow:hidden}.statistics-status-track span{display:block;height:100%;background:var(--red)}.statistics-ranking .ranking-item{grid-template-columns:auto auto minmax(0,1fr) auto}.statistics-ranking .ranking-item small{display:block;color:var(--muted)}.statistics-person-list{display:grid;gap:7px}.statistics-person{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:center;padding:8px;border-bottom:1px solid var(--line);cursor:pointer}.statistics-person small{display:block;color:var(--muted)}.statistics-note{color:var(--muted);font-size:12px;margin:8px 0}.statistics-delta.up{color:#59d98e}.statistics-delta.down{color:#ff6f76}.statistics-delta.flat{color:var(--muted)}@media(max-width:1150px){.statistics-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.statistics-toolbar{grid-template-columns:repeat(3,minmax(0,1fr))}.statistics-grid.three{grid-template-columns:1fr 1fr}.statistics-grid.three>:last-child{grid-column:1/-1}}@media(max-width:760px){.statistics-toolbar,.statistics-grid,.statistics-grid.three{grid-template-columns:1fr 1fr}.statistics-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.statistics-wide,.statistics-grid.three>:last-child{grid-column:1/-1}.statistics-table{min-width:0}.statistics-table thead{display:none}.statistics-table,.statistics-table tbody,.statistics-table tr,.statistics-table td{display:block;width:100%}.statistics-table tr{padding:10px;border-bottom:1px solid var(--line)}.statistics-table td{display:flex;justify-content:space-between;gap:12px;border:0;padding:4px;text-align:right}.statistics-table td:before{content:attr(data-label);color:var(--muted);text-align:left}.statistics-table td:first-child{font-weight:700}.statistics-status-row{grid-template-columns:120px minmax(0,1fr) auto}}@media(max-width:500px){.statistics-toolbar,.statistics-grid,.statistics-grid.three,.statistics-kpis{grid-template-columns:1fr}.statistics-wide,.statistics-grid.three>:last-child{grid-column:auto}.statistics-sims{grid-column:auto}.statistics-page .chart{min-width:0}.statistics-ranking .ranking-item{grid-template-columns:auto minmax(0,1fr) auto}}
.statistics-page{overflow-x:visible;max-width:100%}.statistics-toolbar{grid-template-columns:repeat(4,minmax(130px,1fr))}.statistics-chart-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.statistics-chart-grid .statistics-active-panel{grid-column:1/-1}.statistics-chart-grid .panel{min-width:0}.statistics-chart-grid .chart{height:300px;min-width:0}.statistics-chart-grid .statistics-active-panel .chart{height:340px}.statistics-chart-grid .chart-bars{gap:3px}.statistics-chart-grid .chart-column{min-width:0}.statistics-chart-grid .chart-value{display:none}.statistics-chart-grid .chart-label.is-hidden{visibility:hidden}.statistics-rate-legend{color:var(--muted);font-size:12px}.statistics-rate-line{position:absolute;inset:10px 0 28px 0;width:100%;height:calc(100% - 38px);pointer-events:none;overflow:visible}.statistics-rate-line polyline{fill:none;stroke:#f0b94b;stroke-width:2}.statistics-rate-line circle{fill:#f0b94b}.statistics-chart-grid .chart-bars{position:relative}.statistics-table.compact{min-width:0;font-size:12px}.statistics-table.compact th,.statistics-table.compact td{padding:7px 5px}.statistics-table.compact th:last-child,.statistics-table.compact td:last-child{display:none}@media(max-width:900px){.statistics-chart-grid{grid-template-columns:1fr}.statistics-chart-grid .statistics-active-panel{grid-column:auto}.statistics-chart-grid .chart{height:320px}}@media(max-width:600px){.statistics-toolbar{grid-template-columns:1fr}.statistics-chart-grid .chart{height:300px}.statistics-chart-grid .statistics-active-panel .chart{height:320px}}
.longterm-period-overview{margin:18px 0}.longterm-period-table tr{cursor:pointer}.longterm-period-table tr:hover{background:rgba(255,255,255,.04)}#trend-records .row{min-width:0;flex-wrap:wrap}#trend-records .row strong{max-width:100%;overflow-wrap:anywhere}
.longterm-change{display:grid;gap:8px}.longterm-change div{padding:8px 12px;border-left:3px solid var(--accent);background:rgba(255,255,255,.025)}
.longterm-detail-dialog{width:min(760px,calc(100vw - 32px));max-height:min(760px,calc(100vh - 32px));overflow:auto;background:#11151d;color:inherit;border:1px solid #343b48;border-radius:14px;padding:22px}.longterm-detail-dialog::backdrop{background:#000a}.longterm-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.longterm-detail-grid>div{padding:10px;background:#171c25;border-radius:8px}.longterm-period-cards{display:none}.period-running{color:#f0b94a}.period-partial{color:#d9a5ff}.longterm-data-basis{display:flex;gap:8px;flex-wrap:wrap}.longterm-data-basis span{padding:5px 9px;background:#171c25;border-radius:999px}
.longterm-selection{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;align-items:end}.longterm-selection label{min-width:0;color:var(--muted);font-size:12px}.longterm-selection select{display:block;width:100%;margin-top:4px}.longterm-compare-head,.longterm-compare-row{display:grid;grid-template-columns:minmax(130px,1.3fr) repeat(3,minmax(90px,1fr));gap:10px;align-items:center}.longterm-compare-head{padding:0 10px 8px;color:var(--muted)}.longterm-compare-row{padding:10px;border-top:1px solid var(--line)}.longterm-compare-row strong{text-align:right}.longterm-compare-row .up{color:#71d8ad}.longterm-compare-row .down{color:#ff8585}.longterm-compare-note{margin:8px 0 0}
@media(max-width:900px){.longterm-period-table th:nth-child(7),.longterm-period-table td:nth-child(7),.longterm-period-table th:nth-child(11),.longterm-period-table td:nth-child(11){display:none}.longterm-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.longterm-period-table{display:none}.longterm-period-cards{display:grid;gap:10px}.longterm-period-card{width:100%;text-align:left;padding:14px;border:1px solid #303744;border-radius:10px;background:#151a22;color:inherit}.longterm-period-card b,.longterm-period-card span{display:block}.longterm-period-card small{display:block;margin-top:7px}.longterm-detail-grid{grid-template-columns:1fr}.trend-controls{align-items:stretch}.trend-controls select,.trend-controls button{width:100%}}
@media(max-width:900px){.longterm-selection{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.longterm-selection{grid-template-columns:1fr}.longterm-compare-head{display:none}.longterm-compare-row{grid-template-columns:1fr 1fr}.longterm-compare-row span:first-child{grid-column:1/-1;font-weight:700}.longterm-compare-row strong{text-align:left}.longterm-compare-row strong:last-child{grid-column:1/-1}}
.settings-page,.settings-rules-grid,.settings-rule,.test-monitor,.settings-history{min-width:0;max-width:100%}
.settings-page{display:grid;gap:16px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.desktop-presentation fieldset{display:grid;gap:8px;margin:0;padding:0;border:0}.desktop-presentation label{display:flex;align-items:flex-start;gap:10px;min-height:44px;padding:8px;border-radius:8px;cursor:pointer}.desktop-presentation label:hover,.desktop-presentation label:focus-within{background:var(--surface-2,#182235)}.desktop-presentation input{margin-top:4px}.desktop-presentation span{display:grid;gap:3px}.desktop-presentation small{color:var(--muted,#aeb4bf)}html.mobile-shell .desktop-presentation{display:none}
.settings-rules-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.settings-intro details{margin:14px 0}.settings-intro summary,.settings-history summary{cursor:pointer}
.settings-help{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.settings-help p{display:grid;gap:3px;margin:0;padding:10px;border-radius:10px;background:var(--surface-2,#182235)}
.mode-callout,.rule-summary,.action-status{margin-top:10px;padding:10px;border-radius:10px;background:var(--surface-2,#182235)}
.mode-callout.test{border-left:4px solid #f0ad4e}.mode-callout.active{border-left:4px solid #e45d5d}.mode-callout.off{border-left:4px solid #8392a8}
.settings-fields{display:grid;gap:12px}.settings-fields label{display:grid;gap:5px}.settings-fields input[type=number],.settings-fields select,.settings-fields textarea{box-sizing:border-box;width:100%;max-width:100%}
.settings-fields textarea{min-height:130px;resize:vertical}.settings-fields .toggle-label{display:flex;align-items:center;gap:8px}.settings-fields .toggle-label input{width:auto}
.field-help{display:block;color:var(--muted);font-size:.82rem}.rule-summary{line-height:1.45}.action-status{font-size:.86rem}
.settings-monitor-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0}.settings-monitor-kpis>div{padding:12px;border-radius:10px;background:var(--surface-2,#182235)}
.settings-event-list,.settings-history-list{display:grid;gap:8px;margin-top:12px}.settings-event,.history-group{padding:11px;border-radius:10px;background:var(--surface-2,#182235)}
.settings-event-head,.history-group-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.history-group ul{margin:8px 0 0;padding-left:20px}.history-group li{margin:5px 0}
.settings-history>summary{display:flex;justify-content:space-between;gap:12px}.settings-history[open]>summary{margin-bottom:12px}
#settings-active-dialog{max-width:min(520px,calc(100vw - 32px))}
@media(max-width:980px){.settings-rules-grid{grid-template-columns:1fr}.settings-monitor-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.settings-help,.settings-monitor-kpis{grid-template-columns:1fr}.settings-page .tools{align-items:stretch}.settings-page .tools>*{width:100%}.settings-event-head,.history-group-head,.settings-history>summary{flex-direction:column}.settings-rule{padding:14px}}

/* M2: one member data model, mobile-only presentation. */
.member-control-head h2,.member-mobile-toolbar,.member-filter-sheet>header,.member-filter-sheet>footer,.member-chart-switch{display:none}
.member-filter-dialog,.member-filter-sheet{display:contents}.member-filter-backdrop{display:none}
html.mobile-shell .filter-chip{min-height:36px;color:var(--text);cursor:pointer}html.mobile-shell .member-clear-all{min-height:36px;background:transparent;border:0;color:#ff8d93;text-decoration:underline}
.member-detail-skeleton{display:grid;gap:12px;padding:18px}.member-detail-skeleton span{height:70px;border-radius:12px;background:linear-gradient(90deg,var(--panel),#262b35,var(--panel));background-size:200% 100%;animation:member-loading 1.2s infinite}.member-detail-skeleton span:first-child{height:150px}.member-detail-skeleton p{color:var(--muted)}
@keyframes member-loading{to{background-position:-200% 0}}

html.mobile-shell.member-filter-open{overflow:hidden}
html.mobile-shell #members{min-width:0;overflow:visible;padding-bottom:calc(86px + env(safe-area-inset-bottom))}
html.mobile-shell .member-control-head{display:block;margin:0 2px 10px}
html.mobile-shell .member-control-head h2{display:flex;justify-content:space-between;align-items:baseline;margin:0;font-size:25px}
html.mobile-shell #member-mobile-total{font-size:13px;color:var(--muted);font-weight:500}
html.mobile-shell #member-headline,html.mobile-shell #member-tabs{display:none}
html.mobile-shell .member-filter-shell{position:sticky;top:calc(58px + env(safe-area-inset-top));z-index:8;padding:10px;margin:0 -2px 10px;border-radius:12px;background:rgba(9,10,13,.97)}
html.mobile-shell .member-search{min-height:46px;margin:0 0 8px;font-size:16px}
html.mobile-shell .member-mobile-toolbar{display:grid;grid-template-columns:minmax(110px,.8fr) minmax(0,1.2fr);gap:8px}
html.mobile-shell .member-mobile-toolbar button,html.mobile-shell .member-mobile-toolbar select{width:100%;min-height:44px}
html.mobile-shell #member-filter-open{display:flex;justify-content:center;gap:6px;align-items:center}
html.mobile-shell #member-filter-count{display:grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:#fff1;color:#fff}
html.mobile-shell .member-active-filters{margin:9px 0 0;display:flex;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;padding-bottom:2px;scrollbar-width:none}
html.mobile-shell .member-active-filters::-webkit-scrollbar{display:none}
html.mobile-shell .member-active-filters .filter-chip,html.mobile-shell .member-active-filters .member-clear-all{flex:0 0 auto;min-height:44px;white-space:nowrap}
html.mobile-shell .member-result-head{margin:8px 2px 10px}
html.mobile-shell #member-reset{display:none}
html.mobile-shell .member-table-wrap{border:0;overflow:visible}
html.mobile-shell .member-table{display:none}
html.mobile-shell .member-mobile{display:grid;gap:10px}
html.mobile-shell .member-card{display:block;min-width:0;padding:14px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(145deg,#171a21,#101217);color:var(--text);text-decoration:none;box-shadow:0 8px 22px #0004;touch-action:manipulation}
html.mobile-shell .member-card:focus-visible{outline:3px solid #ff5963;outline-offset:2px}
html.mobile-shell .member-card-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px}
html.mobile-shell .member-card-head .avatar{width:48px;height:48px}
html.mobile-shell .member-card-head b,html.mobile-shell .member-card-head small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.mobile-shell .member-card-head b{font-size:17px}.member-card-head small{color:var(--muted);margin-top:2px}
html.mobile-shell .member-card-open{min-height:44px;display:flex;align-items:center;color:#ff8d93;font-weight:700}
html.mobile-shell .member-primary-status,html.mobile-shell .member-card-sims{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
html.mobile-shell .member-card-activity,html.mobile-shell .member-card-meta{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-top:10px;color:#c7cad1;font-size:13px}
html.mobile-shell .member-card-meta{padding-top:9px;border-top:1px solid var(--line);color:var(--muted)}
html.mobile-shell .member-pill{display:inline-flex;align-items:center;min-height:28px;padding:4px 8px}

html.mobile-shell .member-filter-dialog{display:none;position:fixed;inset:0;z-index:80}
html.mobile-shell .member-filter-dialog.open{display:block}
html.mobile-shell .member-filter-backdrop{display:block;position:absolute;inset:0;background:#000a}
html.mobile-shell .member-filter-sheet{display:flex;flex-direction:column;position:absolute;left:0;right:0;bottom:0;max-height:min(82vh,720px);padding:0 16px calc(16px + env(safe-area-inset-bottom));border:1px solid #343944;border-radius:20px 20px 0 0;background:#11141a;box-shadow:0 -18px 50px #0009;overflow:hidden}
html.mobile-shell .member-filter-sheet>header{display:flex;align-items:center;justify-content:space-between;min-height:60px;border-bottom:1px solid var(--line)}
html.mobile-shell .member-filter-sheet>header h2{margin:0;font-size:21px}
html.mobile-shell .member-filter-sheet>header button{min-width:44px;min-height:44px;padding:0;font-size:26px;background:transparent}
html.mobile-shell .member-filter-row{display:grid;grid-template-columns:1fr;gap:12px;padding:14px 2px;overflow-y:auto;overscroll-behavior:contain}
html.mobile-shell .member-filter-row>label,html.mobile-shell .member-role-filter{font-size:13px}
html.mobile-shell .member-filter-row select{min-height:44px}
html.mobile-shell .member-role-filter{padding:11px}
html.mobile-shell .member-role-options label,html.mobile-shell .member-role-mode label{display:flex;align-items:center;min-height:44px;padding:7px 10px}
html.mobile-shell .member-former-toggle{min-height:44px}
html.mobile-shell .member-filter-sheet>footer{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding-top:12px;border-top:1px solid var(--line)}
html.mobile-shell .member-filter-sheet>footer button{min-height:48px}

html.mobile-shell #member-profile{min-width:0;overflow:visible;padding-bottom:calc(86px + env(safe-area-inset-bottom))}
html.mobile-shell .member-profile-page{min-width:0;overflow:visible}
html.mobile-shell .profile-actions{position:sticky;top:calc(58px + env(safe-area-inset-top));z-index:9;margin:0 -2px 8px;padding:5px 2px;background:rgba(9,10,13,.97)}
html.mobile-shell .profile-actions #back{min-height:44px;background:transparent;border:0;padding:8px 4px;color:#ff8d93;font-size:16px}
html.mobile-shell .profile-actions small{display:none}
html.mobile-shell .profile-hero{padding:14px;border-radius:14px}
html.mobile-shell .profile-head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start}
html.mobile-shell .profile-hero .avatar.large{width:72px;height:72px}
html.mobile-shell .profile-head .inactivity-state{grid-column:1/-1;width:100%}
html.mobile-shell .profile-meta{gap:5px}
html.mobile-shell .profile-roles{max-height:76px;overflow:auto}
html.mobile-shell .profile-section-nav{top:calc(106px + env(safe-area-inset-top));z-index:8;margin:0 -2px;padding:8px 2px;overflow-x:auto;scroll-snap-type:x proximity;overscroll-behavior-x:contain}
html.mobile-shell .profile-section-nav a{display:flex;align-items:center;min-height:44px;padding:8px 12px;scroll-snap-align:start}
html.mobile-shell .profile-kpi-groups,html.mobile-shell .profile-grid{grid-template-columns:1fr;gap:10px}
html.mobile-shell .profile-kpi-group{padding:12px}html.mobile-shell .profile-kpi-group .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
html.mobile-shell .member-chart-switch{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}
html.mobile-shell .member-chart-switch button{min-height:44px;background:var(--panel);border:1px solid var(--line)}
html.mobile-shell .member-chart-switch button.active{border-color:var(--red);background:var(--red2)}
html.mobile-shell #member-section-aktivität{display:block;min-width:0}
html.mobile-shell #member-section-aktivität>article{display:none}
html.mobile-shell #member-section-aktivität>article:first-child{display:block}
html.mobile-shell #member-section-aktivität[data-active-chart="message"]>article:first-child{display:none}
html.mobile-shell #member-section-aktivität[data-active-chart="message"]>article:nth-child(2){display:block}
html.mobile-shell #member-section-aktivität .chart{min-width:0;height:270px}
html.mobile-shell .member-records .row,html.mobile-shell #member-section-tickets .row{display:grid;grid-template-columns:1fr;gap:9px;padding:12px;border:1px solid var(--line);border-radius:10px;margin-bottom:8px}
html.mobile-shell .member-records textarea{width:100%;min-height:220px;max-height:45vh;resize:vertical}
html.mobile-shell .member-records .admin-actions,html.mobile-shell #member-section-tickets .admin-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
html.mobile-shell .member-records button,html.mobile-shell #member-section-tickets button{min-height:44px}

@media (max-width:430px){html.mobile-shell .member-card-activity,html.mobile-shell .member-card-meta{display:grid;grid-template-columns:1fr}.member-filter-sheet{max-height:88vh}}
.mobile-header,.mobile-nav{display:none}
.mobile-page{min-width:0}
html.mobile-shell,html.mobile-shell body{max-width:100%;overflow-x:clip}
html.mobile-shell .app{display:block;min-width:0;width:100%}
html.mobile-shell aside,html.mobile-shell .top{display:none}
html.mobile-shell main{min-width:0;width:100%;max-width:100%;padding:calc(56px + env(safe-area-inset-top)) 16px calc(80px + env(safe-area-inset-bottom));box-sizing:border-box}
html.mobile-shell .mobile-header{display:flex;position:fixed;z-index:40;inset:0 0 auto 0;min-height:56px;padding:env(safe-area-inset-top) 16px 0;background:#111318;border-bottom:1px solid #2b2f37;box-sizing:content-box;flex-direction:column;justify-content:center}
.mobile-header>div{display:flex;align-items:center;justify-content:space-between;min-height:26px}.mobile-header b{font-size:13px}.mobile-header h1{font-size:18px;line-height:1;margin:0}.mobile-header span{font-size:12px;color:#72d59a}.mobile-header button{min-width:44px;min-height:44px;margin:-9px 0;border:0;background:transparent;color:inherit;font-size:24px}
html.mobile-shell .mobile-nav{display:grid;position:fixed;z-index:50;inset:auto 0 0 0;height:calc(64px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);grid-template-columns:repeat(5,1fr);background:#111318;border-top:1px solid #2b2f37}
.mobile-nav a{display:flex;min-width:0;min-height:64px;align-items:center;justify-content:center;flex-direction:column;gap:3px;color:#b9bec8;text-decoration:none;font-size:11px}.mobile-nav a>span{font-size:20px;line-height:20px}.mobile-nav a.active{color:#fff;background:rgba(210,30,45,.17);box-shadow:inset 0 3px #d21e2d}
html.mobile-shell main>section:not(.mobile-page){max-width:100%;min-width:0;overflow-x:auto}
.mobile-page{padding:12px 0}.mobile-page>h2{font-size:24px;margin:4px 0 16px}.mobile-loading,.mobile-stale{min-height:180px;display:grid;place-items:center;text-align:center;color:#b9bec8}.mobile-stale{min-height:auto;display:flex;gap:8px;justify-content:space-between;background:#493a18;border-radius:10px;padding:10px;margin-bottom:12px;font-size:13px}.mobile-stale button{min-height:44px}
#mobile-home-content{display:grid;gap:12px}.mobile-card{min-width:0;margin:0;padding:14px 16px;border-radius:12px;background:#181b21;border:1px solid #292d35}.mobile-card h2{display:flex;justify-content:space-between;gap:8px;margin:0 0 10px;font-size:18px}.mobile-card>.mobile-link{margin:0 -8px}.mobile-link{display:flex;align-items:center;gap:12px;min-height:48px;padding:7px 8px;color:inherit;text-decoration:none;border-radius:9px;box-sizing:border-box}.mobile-link:hover,.mobile-link:focus{background:#242830}.mobile-link>span:not(:last-child){display:flex;min-width:0;flex:1;flex-direction:column}.mobile-link>span:last-child{margin-left:auto;font-size:22px}.mobile-link small,.mobile-event small,.mobile-voice small,.mobile-kpis small{display:block;color:#aeb4bf;font-size:13px}.mobile-link.critical{color:#ff7b83}.mobile-voice,.mobile-event{padding:9px 0;border-top:1px solid #292d35}.mobile-voice:first-of-type,.mobile-event:first-of-type{border-top:0}.mobile-voice small{margin-top:4px;white-space:normal}.mobile-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.mobile-kpis.two{grid-template-columns:repeat(2,minmax(0,1fr))}.mobile-kpis b{font-size:20px;min-width:0}.mobile-kpis small{margin-top:4px;font-weight:400}.mobile-empty{color:#aeb4bf;font-size:15px;margin:8px 0}.mobile-menu{display:grid;gap:8px}.mobile-menu .mobile-link{background:#181b21;border:1px solid #292d35;padding:10px 14px}.mobile-presentation{margin-top:18px;border:1px solid #292d35;border-radius:12px;padding:12px}.mobile-presentation label{display:flex;align-items:center;min-height:44px;gap:10px}
@media (min-width:700px) and (max-width:1023px){html:not(.mobile-shell) .mobile-header,html:not(.mobile-shell) .mobile-nav{display:none}}
@media (min-width:1024px){html:not(.mobile-shell) .mobile-header,html:not(.mobile-shell) .mobile-nav{display:none}}
