
.metrics-page{background:#eef3f6;min-height:100vh;color:#0b2237;font-family:Manrope,Arial,sans-serif}
.metrics-shell{width:min(1180px,calc(100% - 36px));margin:auto;padding:56px 0 90px}
.metrics-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:28px}
.metrics-head h1{font-size:clamp(40px,5vw,66px);line-height:1;letter-spacing:-.055em;margin:8px 0}.metrics-head p{max-width:700px;color:#657886}
.metrics-auth{display:flex;gap:8px;max-width:520px;margin:18px 0}.metrics-auth input{flex:1;padding:12px;border:1px solid #ccd9e2;border-radius:10px}.metrics-auth button{border:0;background:#07172c;color:#fff;padding:0 16px;border-radius:10px;font-weight:800}
.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.metric{background:#fff;border:1px solid #dbe4ea;border-radius:18px;padding:19px}.metric small{font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:#718491;font-weight:900}.metric strong{display:block;font-size:38px;letter-spacing:-.05em;margin-top:5px}
.funnel{margin-top:18px;background:#fff;border:1px solid #dbe4ea;border-radius:22px;padding:24px}.funnel h2{margin:0 0 17px}.funnel-row{display:grid;grid-template-columns:180px 1fr 80px;gap:12px;align-items:center;margin:10px 0}.bar{height:13px;border-radius:999px;background:#e7eef2;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,#22b8f0,#0e4f77);border-radius:999px}.config-note{margin-top:18px;background:#fff8dc;border:1px solid #efdc8a;color:#735c00;border-radius:14px;padding:13px}
@media(max-width:850px){.metric-grid{grid-template-columns:1fr 1fr}.metrics-head{display:block}.funnel-row{grid-template-columns:130px 1fr 65px}}@media(max-width:520px){.metric-grid{grid-template-columns:1fr}.funnel-row{grid-template-columns:1fr}.metrics-auth{display:grid}}
