#cx-matchmaking{--mm-bg:#1e1b1e;--mm-card:#282428;--mm-border:#433b43;--mm-muted:#b4a9b3;--mm-accent:#ea4b65;color:#f5f0f3;font-family:Inter,Arial,sans-serif;max-width:1280px;margin:24px auto;padding:24px;box-sizing:border-box;line-height:1.5} #cx-matchmaking *{box-sizing:border-box}#cx-matchmaking a{color:inherit;text-decoration:none}#cx-matchmaking button,#cx-matchmaking input,#cx-matchmaking select{font:inherit}#cx-matchmaking button{cursor:pointer}#cx-matchmaking button:disabled{opacity:.5;cursor:default}#cx-matchmaking button:focus-visible,#cx-matchmaking a:focus-visible,#cx-matchmaking input:focus-visible,#cx-matchmaking select:focus-visible{outline:2px solid #f58899;outline-offset:3px} #cx-matchmaking dialog:not([open]){display:none!important} #cx-matchmaking .mm-icon.bx{display:inline-flex;align-items:center;justify-content:center;flex:0 0 18px;width:18px;height:18px;font-family:boxicons!important;font-size:18px;font-weight:400!important;font-style:normal!important;line-height:1;vertical-align:middle;transform:none} #cx-matchmaking .mm-icon:before{font-family:boxicons!important} #cx-matchmaking .mm-link-icon,#cx-matchmaking .mm-back,#cx-matchmaking .mm-card-bottom>span:last-child{display:inline-flex;align-items:center;gap:8px} #cx-matchmaking .mm-hero>a{gap:10px} #cx-matchmaking p,#cx-matchmaking label,#cx-matchmaking input,#cx-matchmaking select{font-family:Inter,Arial,sans-serif} #cx-matchmaking h1,#cx-matchmaking h2,#cx-matchmaking h3,#cx-matchmaking p{margin:0}#cx-matchmaking h1{font-size:clamp(32px,5vw,55px);font-weight:800;letter-spacing:-2px}#cx-matchmaking h2{font-size:24px;font-weight:700}#cx-matchmaking h3{font-size:18px;font-weight:650}#cx-matchmaking p{color:var(--mm-muted);margin-top:7px}#cx-matchmaking .mm-hero{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:34px;border:1px solid var(--mm-border);border-radius:16px;background:radial-gradient(ellipse at top right,#582b3c99,transparent 70%),linear-gradient(120deg,#211c23,#31232c);margin-bottom:24px}#cx-matchmaking .mm-eyebrow{display:block;letter-spacing:2px;color:#d998a7;font-size:11px;font-weight:700;margin-bottom:8px} #cx-matchmaking .mm-tabs{display:flex;gap:6px;flex-wrap:wrap;border-bottom:1px solid var(--mm-border);padding-bottom:14px;margin-bottom:26px}#cx-matchmaking .mm-tabs :is(button,.mm-tab-link){border:0;background:transparent;color:var(--mm-muted);padding:11px 18px;border-radius:8px;font-weight:600}#cx-matchmaking .mm-tabs :is(button,.mm-tab-link).active,#cx-matchmaking .mm-chat-tabs button.active{color:#fff;background:#50313e}#cx-matchmaking .mm-tabs :is(button,.mm-tab-link):hover{background:#332b33} #cx-matchmaking .mm-primary,#cx-matchmaking .mm-outline{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:8px;border:1px solid var(--mm-border);background:#332c33;color:#f8f3f6;font-size:13px;font-weight:600;line-height:1.5;text-align:center}#cx-matchmaking .mm-primary{background:#d9425b;border-color:#d9425b;color:#fff}#cx-matchmaking .mm-primary:hover{background:#ef536d}#cx-matchmaking .mm-outline:hover{border-color:#ae697a;background:#3d2d37} #cx-matchmaking .mm-section-head{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:20px}#cx-matchmaking .mm-section-head p{font-size:13px}#cx-matchmaking .mm-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0 25px}#cx-matchmaking .mm-summary>div{border:1px solid var(--mm-border);border-radius:10px;background:#252025;padding:18px;display:flex;flex-direction:column;gap:2px}#cx-matchmaking .mm-summary strong{font-size:26px;font-weight:700}#cx-matchmaking .mm-summary span{color:var(--mm-muted);font-size:12px} #cx-matchmaking .mm-card{display:block;padding:22px;border:1px solid var(--mm-border);border-radius:12px;background:var(--mm-card);margin-bottom:16px;min-width:0}#cx-matchmaking .mm-lobby-grid,#cx-matchmaking .mm-team-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}#cx-matchmaking .mm-lobby-card:hover{border-color:#995164;transform:translateY(-2px);transition:transform .15s,border-color .15s}#cx-matchmaking .mm-card-top,#cx-matchmaking .mm-card-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:12px;color:var(--mm-muted)}#cx-matchmaking .mm-card-top{margin-bottom:18px}#cx-matchmaking .mm-card-bottom{border-top:1px solid var(--mm-border);padding-top:15px;margin-top:20px}#cx-matchmaking .mm-versus{display:grid;grid-template-columns:1fr auto 1fr;gap:15px;align-items:center;margin:22px 0 10px;font-weight:600}#cx-matchmaking .mm-versus>span:last-child{text-align:right}#cx-matchmaking .mm-versus i{font-size:12px;color:#b28391;font-style:normal}#cx-matchmaking .mm-badge{display:inline-block;background:#382b36;color:#f0c1cd;border:1px solid #5c3c4b;padding:4px 10px;border-radius:6px;font-size:12px;white-space:nowrap} #cx-matchmaking .mm-empty{padding:55px 22px;text-align:center;border:1px dashed var(--mm-border);border-radius:12px;margin-top:14px}#cx-matchmaking .mm-empty-icon{display:block;font-size:34px;color:#c87589;margin-bottom:13px}#cx-matchmaking .mm-empty p{font-size:13px}#cx-matchmaking .mm-login{background:#372832;border:1px solid #724657;border-radius:8px;padding:16px;font-size:13px;margin-bottom:20px}#cx-matchmaking .mm-login a{color:#ff9eb0;text-decoration:underline}#cx-matchmaking .mm-actions{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}#cx-matchmaking .mm-roster-row{display:flex;gap:12px;align-items:center;min-height:63px;border-top:1px solid var(--mm-border);padding:12px 0;font-size:13px}#cx-matchmaking .mm-roster-row strong{flex:1;min-width:0;overflow-wrap:anywhere}#cx-matchmaking .mm-roster-row small{display:block;color:var(--mm-muted);font-size:11px;font-weight:400}#cx-matchmaking .mm-avatar{height:34px;width:34px;border-radius:9px;background:#49313e;color:#e7b4c2;display:grid;place-items:center;font-weight:700;flex-shrink:0}#cx-matchmaking .mm-ready{color:#87d7b1}#cx-matchmaking .mm-muted{color:var(--mm-muted)}#cx-matchmaking .mm-elo{font-size:32px;color:#ffb1c0;font-weight:700}#cx-matchmaking .mm-elo small{font-size:11px;display:block;text-align:center;color:var(--mm-muted)}#cx-matchmaking .mm-back{display:inline-block;margin-bottom:20px;font-size:13px;color:#d7a4b2} #cx-matchmaking .mm-table-wrap{overflow-x:auto;border:1px solid var(--mm-border);border-radius:10px}#cx-matchmaking table{width:100%;border-collapse:collapse;background:var(--mm-card);font-size:13px}#cx-matchmaking th,#cx-matchmaking td{text-align:left;padding:17px 18px;white-space:nowrap;border-bottom:1px solid var(--mm-border)}#cx-matchmaking th{font-size:11px;color:var(--mm-muted);font-weight:600;letter-spacing:.6px}#cx-matchmaking .mm-tag{font-size:10px;border:1px solid #6b4554;border-radius:4px;padding:3px 6px;color:#e3a7b7;margin-right:10px}#cx-matchmaking .mm-accent{color:#f9a9ba;font-weight:700}#cx-matchmaking .mm-match-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:15px;align-items:center;text-align:center}#cx-matchmaking .mm-match-row>span{font-weight:700}#cx-matchmaking .mm-match-row small{display:block;color:var(--mm-muted);font-size:11px;font-weight:400;margin-top:5px}#cx-matchmaking .mm-match-row strong{font-size:27px}#cx-matchmaking .mm-score{display:block;font-size:40px;margin-top:15px}#cx-matchmaking .mm-map-grid{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}#cx-matchmaking .mm-map-result .mm-outline{margin-left:12px} #cx-matchmaking .mm-chat-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}#cx-matchmaking .mm-chat-tabs{display:flex;gap:6px}#cx-matchmaking .mm-chat-tabs button{border:0;background:#332b33;color:#cdbfc9;border-radius:7px;padding:8px 14px;font-size:12px}#cx-matchmaking .mm-chat-tabs span{font-size:8px;color:#b989a5}#cx-matchmaking .mm-chat-hint{font-size:11px}#cx-matchmaking .mm-messages{height:290px;overflow-y:auto;overscroll-behavior:contain;border-top:1px solid var(--mm-border);border-bottom:1px solid var(--mm-border);padding:14px 2px;margin:15px 0;scrollbar-color:#70515f #282428}#cx-matchmaking .mm-message{margin-bottom:16px}#cx-matchmaking .mm-message>div{display:flex;gap:12px;align-items:center;font-size:12px}#cx-matchmaking .mm-message time{font-size:10px;color:#a99aa6}#cx-matchmaking .mm-message p{color:#efe5ed;font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere;margin-top:3px}#cx-matchmaking #mm-chat-form{display:flex;gap:10px}#cx-matchmaking input,#cx-matchmaking select{width:100%;min-width:0;background:#211c22;border:1px solid #5b4656;border-radius:7px;padding:10px 12px;color:#fff}#cx-matchmaking input:focus{border-color:#db6c85}#cx-matchmaking .mm-footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:#b1a1ae;font-size:11px;border-top:1px solid var(--mm-border);padding-top:20px;margin-top:35px} #cx-matchmaking #mm-notice:not(:empty){padding:12px 16px;border-radius:8px;margin-bottom:18px;font-size:13px}#cx-matchmaking .mm-error{background:#4d2734;color:#ffc1d0}#cx-matchmaking .mm-success{background:#203b30;color:#a5e0c3}#cx-matchmaking dialog{background:#29212a;color:#fff;border:1px solid #664455;border-radius:14px;padding:24px;width:min(480px,calc(100% - 28px));max-height:90vh}#cx-matchmaking dialog::backdrop{background:#100b11cc}#cx-matchmaking .mm-dialog-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}#cx-matchmaking .mm-dialog-head button{border:0;background:none;color:#d6c2d1;font-size:30px;line-height:1}#cx-matchmaking dialog label{display:block;font-size:12px;color:#d0bdca;margin-bottom:17px}#cx-matchmaking dialog label input,#cx-matchmaking dialog label select{display:block;margin-top:7px}#cx-matchmaking #mm-form-error{color:#ffaabd;margin-bottom:15px}#cx-matchmaking .mm-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}#cx-matchmaking .mm-busy [data-action]{pointer-events:none;opacity:.6} @media(min-width:1100px){#cx-matchmaking{display:grid;grid-template-columns:180px minmax(0,1fr);gap:0 26px}#cx-matchmaking .mm-hero,#cx-matchmaking .mm-footer{grid-column:1/-1}#cx-matchmaking .mm-tabs{grid-column:1;grid-row:2/4;display:flex;flex-direction:column;border-bottom:0;border-right:1px solid var(--mm-border);padding-right:16px;align-self:start}#cx-matchmaking .mm-tabs :is(button,.mm-tab-link){text-align:left;padding:13px 12px}#cx-matchmaking #mm-notice,#cx-matchmaking #mm-view{grid-column:2;min-width:0}} @media(max-width:600px){#cx-matchmaking{margin:12px auto;padding:12px}#cx-matchmaking .mm-hero{padding:24px 18px;display:block}#cx-matchmaking .mm-hero>a{margin-top:20px}#cx-matchmaking .mm-tabs{gap:3px}#cx-matchmaking .mm-tabs :is(button,.mm-tab-link){font-size:12px;padding:9px 10px}#cx-matchmaking .mm-section-head{align-items:flex-start;flex-wrap:wrap}#cx-matchmaking h2{font-size:21px}#cx-matchmaking .mm-summary{gap:7px}#cx-matchmaking .mm-summary>div{padding:12px}#cx-matchmaking .mm-summary strong{font-size:22px}#cx-matchmaking .mm-summary span{font-size:10px}#cx-matchmaking .mm-lobby-grid,#cx-matchmaking .mm-team-grid{grid-template-columns:1fr;gap:0}#cx-matchmaking .mm-card{padding:17px}#cx-matchmaking .mm-match-row{grid-template-columns:1fr auto 1fr;gap:8px;font-size:12px}#cx-matchmaking .mm-match-row small{font-size:10px}#cx-matchmaking #mm-chat-form{flex-wrap:wrap}#cx-matchmaking #mm-chat-form input{flex-basis:100%}#cx-matchmaking #mm-chat-form button{width:100%}} /* Matchmaking owns its layout; GameCMS form and dialog styles stay outside it. */ #cx-matchmaking{width:calc(100% - 48px);max-width:1320px;margin:32px auto;padding:24px;background:#262126;border:1px solid #493e47;border-radius:14px;box-shadow:0 12px 38px #100b1026} #cx-matchmaking,#cx-matchmaking *{font-family:Arial,sans-serif!important} #cx-matchmaking .mm-hero{min-height:0;margin:0 0 24px;padding:0 0 22px;background:none;border:0;border-bottom:1px solid var(--mm-border);border-radius:0;gap:20px} #cx-matchmaking .mm-hero h1{font-size:32px;letter-spacing:-1px;line-height:1.2} #cx-matchmaking .mm-hero p{font-size:13px;margin-top:6px} #cx-matchmaking .mm-eyebrow{font-size:10px;letter-spacing:1.2px;margin-bottom:7px} #cx-matchmaking .mm-section-head{margin-bottom:16px} #cx-matchmaking .mm-section-head h2{font-size:23px;line-height:1.3} #cx-matchmaking .mm-section-head p{font-size:13px} #cx-matchmaking .mm-card{background:#2d272d;box-shadow:none;border-color:#4d414b;border-radius:10px;padding:22px} #cx-matchmaking .mm-team-create{max-width:760px;min-height:0} #cx-matchmaking .mm-card h3{font-size:18px;line-height:1.4} #cx-matchmaking .mm-card p{font-size:13px;line-height:1.6} #cx-matchmaking .mm-actions{margin-top:18px} #cx-matchmaking .mm-tabs :is(button,.mm-tab-link){font-size:13px;font-weight:600;line-height:1.5} #cx-matchmaking .mm-tabs :is(button,.mm-tab-link).active{background:#513440;border:1px solid #805264} #cx-matchmaking .mm-tabs :is(button,.mm-tab-link):not(.active){border:1px solid transparent} #cx-matchmaking #mm-dialog:not([open]){display:none!important} #cx-matchmaking #mm-dialog[open]{display:block!important;position:fixed!important;inset:0!important;float:none!important;transform:none!important;margin:auto!important;width:480px!important;max-width:calc(100vw - 32px)!important;height:fit-content!important;max-height:calc(100dvh - 40px)!important;overflow:auto!important;padding:24px!important;background:#2d252d!important;border:1px solid #705563!important;border-radius:12px!important;box-shadow:0 24px 90px #0009!important;color:#f6edf2!important} #cx-matchmaking #mm-dialog #mm-form{display:flex!important;flex-direction:column!important;gap:0!important;position:static!important;float:none!important;width:100%!important;height:auto!important;margin:0!important;padding:0!important;background:none!important;box-shadow:none!important;border:0!important} #cx-matchmaking #mm-dialog .mm-dialog-head{display:flex!important;position:static!important;align-items:flex-start!important;justify-content:space-between!important;gap:18px!important;margin:0 0 22px!important;padding:0!important} #cx-matchmaking #mm-dialog .mm-dialog-head h2{position:static!important;float:none!important;margin:0!important;padding:0!important;font:700 23px/1.3 Inter,Arial,sans-serif!important;color:#fff!important} #cx-matchmaking #mm-dialog .mm-dialog-head button{position:static!important;float:none!important;flex:0 0 28px!important;width:28px!important;height:28px!important;padding:0!important;margin:0!important;line-height:26px!important} #cx-matchmaking #mm-fields{position:static!important;display:block!important;width:100%!important;margin:0!important;padding:0!important} #cx-matchmaking #mm-dialog #mm-fields label{position:static!important;inset:auto!important;float:none!important;transform:none!important;display:flex!important;flex-direction:column!important;gap:8px!important;align-items:stretch!important;width:100%!important;height:auto!important;margin:0 0 18px!important;padding:0!important;font:500 13px/1.5 Inter,Arial,sans-serif!important;color:#cdbbc8!important} #cx-matchmaking #mm-dialog #mm-fields input,#cx-matchmaking #mm-dialog #mm-fields select{position:static!important;inset:auto!important;float:none!important;transform:none!important;display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;height:44px!important;min-height:44px!important;margin:0!important;padding:10px 12px!important;box-sizing:border-box!important;font:400 14px/1.4 Inter,Arial,sans-serif!important;background:#221e23!important;color:#fff!important;border:1px solid #66505f!important;border-radius:7px!important} #cx-matchmaking #mm-dialog #mm-form>.mm-primary{position:static!important;width:100%!important;margin:4px 0 0!important;padding:11px 16px!important;min-height:44px!important;line-height:1.5!important} #cx-matchmaking #mm-dialog #mm-form-error:empty{display:none} #cx-matchmaking #mm-dialog #mm-form-error:not(:empty){position:static!important;margin:0 0 14px!important;font-size:13px!important} #cx-matchmaking #mm-dialog::backdrop{background:#0c080dcc!important} @media(min-width:1100px){#cx-matchmaking{grid-template-columns:180px minmax(0,1fr);gap:0 24px}#cx-matchmaking .mm-tabs{padding-right:16px}#cx-matchmaking .mm-tabs :is(button,.mm-tab-link){padding:11px 12px;margin-bottom:5px}#cx-matchmaking #mm-view{min-height:240px}} @media(max-width:600px){#cx-matchmaking{width:calc(100% - 24px);margin:20px auto;padding:16px;border-radius:12px}#cx-matchmaking .mm-hero{padding:0 0 18px;margin-bottom:18px}#cx-matchmaking .mm-hero h1{font-size:29px}#cx-matchmaking .mm-hero>a{margin-top:14px;padding:8px 12px;font-size:11px}#cx-matchmaking .mm-hero .mm-eyebrow{font-size:9px;letter-spacing:.8px}#cx-matchmaking .mm-card{padding:16px}#cx-matchmaking #mm-dialog[open]{padding:20px!important}#cx-matchmaking #mm-dialog .mm-dialog-head h2{font-size:21px!important}} /* Use MATCH HUB's existing outer container, typeface, surfaces and borders. */ body.cx-match-hub-page #cx-matchmaking{width:100%!important;max-width:var(--cx-site-nav-width,1320px)!important;margin:0 auto!important;box-sizing:border-box!important;background:rgba(38,32,36,.96);border:1px solid #4a3d44;border-radius:20px;padding:26px;min-width:0;box-shadow:0 16px 45px #100c1026;text-shadow:none;--mm-card:#2c252a;--mm-border:#493c44;--mm-muted:#b6aab2;--mm-accent:#ff697c;font-family:CX Inter,Arial,sans-serif!important;font-size:14px;font-weight:550;line-height:1.5;-webkit-font-smoothing:antialiased} #cx-matchmaking,#cx-matchmaking *{font-family:CX Inter,Arial,sans-serif!important;text-shadow:none!important} #cx-matchmaking .mm-hero h1{font-size:38px;font-weight:900;letter-spacing:-1.7px} #cx-matchmaking .mm-hero{padding-bottom:22px;border-bottom-color:#493c44} #cx-matchmaking .mm-card,#cx-matchmaking .mm-summary>div{background:#2c252a;border-color:#493c44;border-radius:7px} #cx-matchmaking .mm-primary{background:#ff697c;border-color:#ff697c;color:#21161d;font-weight:750;border-radius:5px} #cx-matchmaking .mm-primary:hover{background:#ff8b99;border-color:#ff8b99} #cx-matchmaking .mm-outline{background:#392c33;border-color:#654c5a;color:#fff;border-radius:5px} #cx-matchmaking .mm-tabs :is(button,.mm-tab-link).active{background:#4b3541;border-color:#896172;color:#fff} #cx-matchmaking .mm-tabs{border-color:#493c44} #cx-matchmaking .mm-empty{padding:28px 20px;min-height:180px;background:#2c252a;border:1px solid #493c44;border-radius:7px} #cx-matchmaking .mm-empty-icon{display:none} #cx-matchmaking .mm-summary{margin:16px 0 20px} #cx-matchmaking .mm-summary>div{padding:15px 18px} #cx-matchmaking .mm-summary strong{font-size:24px} #cx-matchmaking .mm-footer{margin-top:24px} #cx-matchmaking #mm-dialog[open]{background:#2c252a!important;border-color:#654c5a!important} #cx-matchmaking #mm-dialog .mm-dialog-head h2,#cx-matchmaking #mm-dialog #mm-fields label,#cx-matchmaking #mm-dialog #mm-fields input,#cx-matchmaking #mm-dialog #mm-fields select{font-family:CX Inter,Arial,sans-serif!important} #cx-matchmaking #mm-dialog #mm-form>.mm-primary{font-family:CX Inter,Arial,sans-serif!important} @media(max-width:600px){body.cx-match-hub-page #cx-matchmaking{padding:18px 12px;border-radius:14px}#cx-matchmaking .mm-hero h1{font-size:29px}#cx-matchmaking .mm-summary>div{padding:11px}#cx-matchmaking .mm-summary strong{font-size:21px}} #cx-matchmaking select,#cx-matchmaking #mm-dialog #mm-fields select{appearance:none!important;-webkit-appearance:none!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23e9dfe5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 14px center!important;background-size:16px 16px!important;padding-right:44px!important} /* Matchmaking navigation v7 */ #cx-matchmaking #mm-notice:empty{display:none} @media(min-width:1100px){#cx-matchmaking{grid-template-rows:auto auto minmax(0,1fr) auto}#cx-matchmaking #mm-notice{grid-row:2;align-self:start}#cx-matchmaking #mm-view{grid-row:3;align-self:start}#cx-matchmaking .mm-footer{grid-row:4}} #cx-matchmaking .mm-tabs{gap:5px} #cx-matchmaking .mm-tabs .mm-nav-item{display:flex;align-items:center;gap:11px;min-height:53px;padding:9px 10px;border-radius:9px;position:relative;transition:background .15s,border-color .15s;color:#c7bcc3} #cx-matchmaking .mm-tabs .mm-nav-item>span:nth-child(2){min-width:0;line-height:1.35} #cx-matchmaking .mm-nav-icon{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border:1px solid #60404c;background:#392a32;border-radius:8px;color:#ef8799} #cx-matchmaking .mm-nav-icon .mm-icon.bx{width:19px;height:19px;font-size:19px} #cx-matchmaking .mm-tabs .mm-nav-item:hover{background:#372a32;border-color:#60404c;color:#fff} #cx-matchmaking .mm-tabs .mm-nav-item.active{background:linear-gradient(100deg,#57313f,#3e2c35);border:1px solid #9b5368;box-shadow:inset 3px 0 #ff7b91;color:#fff} #cx-matchmaking .mm-nav-item.active .mm-nav-icon{background:#bc506c;border-color:#d97790;color:#fff} #cx-matchmaking .mm-nav-divider{display:block;flex-basis:100%;height:1px;background:#493c44;margin:10px 4px} #cx-matchmaking .mm-nav-arrow{margin-left:auto;font-family:boxicons!important;font-size:18px;color:#9c7888} @media(min-width:1100px){#cx-matchmaking{grid-template-columns:224px minmax(0,1fr)}#cx-matchmaking .mm-tabs{padding-right:18px}#cx-matchmaking .mm-tabs .mm-nav-item{margin-bottom:0}#cx-matchmaking .mm-nav-divider{flex-basis:auto}} @media(max-width:1099px){#cx-matchmaking .mm-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}#cx-matchmaking .mm-nav-divider{grid-column:1/-1;margin:4px 0}#cx-matchmaking .mm-tabs .mm-nav-item{font-size:12px;padding:8px;gap:8px}} @media(max-width:600px){#cx-matchmaking .mm-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}#cx-matchmaking .mm-tabs .mm-nav-item{min-height:54px}#cx-matchmaking .mm-nav-icon{flex-basis:28px;width:28px;height:28px;border-radius:7px}#cx-matchmaking .mm-nav-arrow{display:none}} @media(prefers-reduced-motion:reduce){#cx-matchmaking .mm-tabs .mm-nav-item{transition:none}} #cx-matchmaking .mm-shop-grid i.bx,#cx-matchmaking .mm-shop-free i.bx{font-family:boxicons!important;font-weight:400!important;font-style:normal!important} #cx-matchmaking .mm-shop-status{display:flex;align-items:center;gap:9px;margin:0 0 18px;color:#d6cbd0;font-size:13px;flex-wrap:wrap} #cx-matchmaking .mm-shop-status>span:last-child{margin-left:auto;color:#a99ca4} #cx-matchmaking .mm-shop-dot{width:7px;height:7px;background:#e8ad65;border-radius:50%} #cx-matchmaking .mm-shop-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:18px;align-items:stretch} #cx-matchmaking .mm-premium-card{padding:0;overflow:hidden;border-color:#795061;background:linear-gradient(135deg,#392932,#26212a)} #cx-matchmaking .mm-premium-art{min-height:165px;padding:30px 28px 20px;background:radial-gradient(ellipse at 80% 20%,#b54b6d55,transparent 65%),repeating-linear-gradient(135deg,transparent 0,transparent 19px,#ee97af08 20px,#ee97af08 21px),#2c202a;display:flex;flex-direction:column;justify-content:center;gap:15px;border-bottom:1px solid #78506177} #cx-matchmaking .mm-profile-demo{display:flex;align-items:center;gap:14px;min-width:0} #cx-matchmaking .mm-profile-demo>div:last-child{min-width:0} #cx-matchmaking .mm-profile-avatar{width:62px;height:62px;flex-shrink:0;display:grid;place-items:center;border:2px solid #ec8ca3;border-radius:16px;background:linear-gradient(145deg,#85445d,#412b3d);box-shadow:0 0 0 5px #d3789a15;color:#f6d5df;font-size:31px} #cx-matchmaking .mm-demo-name{font-size:18px;color:#f1dde5;display:block;overflow-wrap:anywhere} #cx-matchmaking .mm-demo-name i{color:#f19ab1;vertical-align:middle} #cx-matchmaking .mm-demo-label{display:block;font-size:10px;letter-spacing:1.6px;color:#dca6b6;margin-top:6px} #cx-matchmaking .mm-art-caption{font-size:11px;color:#b293a2} #cx-matchmaking .mm-premium-content{padding:25px 26px} #cx-matchmaking .mm-shop-eyebrow{font-size:10px;letter-spacing:1.3px;color:#bf8fa2} #cx-matchmaking .mm-shop-grid h3{font-size:25px;color:#f5e8ee;margin:8px 0 10px;line-height:1.2} #cx-matchmaking .mm-shop-description{color:#c7b9c2;font-size:14px;line-height:1.6;margin:0} #cx-matchmaking .mm-shop-features{padding:0;margin:23px 0;list-style:none;display:grid;gap:15px} #cx-matchmaking .mm-shop-features li{display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.5;color:#ddd0d8} #cx-matchmaking .mm-shop-features i{font-family:boxicons!important;font-size:19px;flex-shrink:0;color:#df91a8} #cx-matchmaking .mm-shop-buy{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding-top:18px;border-top:1px solid #70506166} #cx-matchmaking .mm-shop-price{font-size:28px;font-weight:600;color:#fff;line-height:1.4} #cx-matchmaking .mm-shop-price span{font-size:12px;font-weight:400;color:#beadb8;white-space:nowrap} #cx-matchmaking .mm-shop-buy button:disabled{opacity:.65;cursor:default;box-shadow:none} #cx-matchmaking .mm-shop-note{font-size:11px;line-height:1.6;color:#aa97a3;margin:12px 0 0} #cx-matchmaking .mm-private-card{padding:26px;display:flex;flex-direction:column;background:linear-gradient(145deg,#302b35,#25232b)} #cx-matchmaking .mm-private-card .mm-shop-features{margin-bottom:auto;padding-bottom:25px} #cx-matchmaking .mm-private-icon{display:flex;align-items:center;gap:5px;margin:9px 0 25px;color:#cbb6cd;font-size:38px} #cx-matchmaking .mm-private-icon i:last-child{font-size:20px;color:#ba899e} #cx-matchmaking .mm-shop-free{display:flex;gap:16px;align-items:center;padding:22px 0;margin-top:20px;border-top:1px solid #55434e} #cx-matchmaking .mm-shop-free>i{font-family:boxicons!important;font-size:29px;color:#d68aa3} #cx-matchmaking .mm-shop-free h3{font-size:14px;margin:0 0 6px;color:#e1d1db} #cx-matchmaking .mm-shop-free p{font-size:12px;color:#b5a5b0;margin:0;line-height:1.5} #cx-matchmaking .mm-shop-free a{margin-left:auto;flex-shrink:0;font-size:12px} @media(max-width:1250px){#cx-matchmaking .mm-shop-grid{grid-template-columns:minmax(0,1fr)}#cx-matchmaking .mm-private-icon{margin-top:0;margin-bottom:15px}} @media(max-width:600px){#cx-matchmaking .mm-premium-content,#cx-matchmaking .mm-private-card{padding:20px}#cx-matchmaking .mm-premium-art{padding:24px 20px}#cx-matchmaking .mm-shop-status>span:last-child{margin-left:0;flex-basis:100%;padding-left:16px}#cx-matchmaking .mm-shop-free{flex-wrap:wrap}#cx-matchmaking .mm-shop-free>div{flex:1;min-width:170px}#cx-matchmaking .mm-shop-free a{margin-left:45px}#cx-matchmaking .mm-profile-avatar{width:48px;height:48px;border-radius:12px}#cx-matchmaking .mm-demo-name{font-size:16px}} #cx-matchmaking .mm-search-motion{position:relative;width:104px;height:104px;margin:12px auto 24px;display:grid;place-items:center;color:#bd8398} #cx-matchmaking .mm-search-core{width:48px;height:48px;display:grid;place-items:center;background:#573440;border:1px solid #a16b81;border-radius:50%;font-size:27px;z-index:1} #cx-matchmaking .mm-search-ring{position:absolute;border:1px solid #be718b55;border-radius:50%;pointer-events:none} #cx-matchmaking .mm-search-ring-outer{inset:0} #cx-matchmaking .mm-search-ring-inner{inset:14px} #cx-matchmaking .mm-search-orbit{position:absolute;inset:0;border-radius:50%;border:1px solid transparent;border-top-color:#a56c82;opacity:.4} #cx-matchmaking .mm-search-motion.is-searching .mm-search-orbit{opacity:1;border-top-color:#f5a2b9;animation:mm-search-orbit 3s linear infinite} #cx-matchmaking .mm-search-motion.is-searching .mm-search-ring-outer{animation:mm-search-pulse 2.8s ease-out infinite} #cx-matchmaking .mm-search-motion.is-searching .mm-search-ring-inner{animation:mm-search-pulse 2.8s ease-out .7s infinite} #cx-matchmaking .mm-search-motion.is-searching .mm-search-core{color:#ffe9f0;box-shadow:0 0 22px #e983a32b} #cx-matchmaking .mm-search-progress{display:flex;gap:5px;max-width:270px;margin:0 auto 10px} #cx-matchmaking .mm-search-progress span{height:4px;border-radius:2px;background:#66515d;flex:1;transition:background-color .35s} #cx-matchmaking .mm-search-progress span.is-filled{background:#e78fa9} #cx-matchmaking .mm-search-clock{text-align:center;font-size:12px;color:#bda5b2!important;margin:0 0 20px!important;font-variant-numeric:tabular-nums} #cx-matchmaking .mm-count-updated{display:inline-block;animation:mm-count-update .45s ease-out} #cx-matchmaking #mm-notice.mm-match-found{background:#49313e;border:1px solid #a86680;color:#fff0f5;padding:15px 18px;border-radius:8px;animation:mm-match-found .5s ease-out} #cx-matchmaking.mm-page-hidden .mm-search-motion *{animation-play-state:paused!important} @keyframes mm-search-orbit{to{transform:rotate(360deg)}} @keyframes mm-search-pulse{0%{opacity:.7;transform:scale(.9)}75%,100%{opacity:.15;transform:scale(1.12)}} @keyframes mm-count-update{0%{transform:translateY(4px);color:#ffd4e2}100%{transform:translateY(0)}} @keyframes mm-match-found{0%{opacity:.4;transform:translateY(-5px)}100%{opacity:1;transform:translateY(0)}} @media(prefers-reduced-motion:reduce){#cx-matchmaking .mm-search-motion *,#cx-matchmaking .mm-count-updated,#cx-matchmaking #mm-notice.mm-match-found{animation:none!important;transition:none!important}} #cx-matchmaking .mm-play-panel{position:relative;overflow:hidden;border:1px solid #51404d;border-radius:12px;background:radial-gradient(ellipse at 50% 30%,#25426322,transparent 60%),#231f27} #cx-matchmaking .mm-play-panel.is-searching{border-color:#526b8c;background:radial-gradient(ellipse at 50% 35%,#284b713f,transparent 65%),#201f28} #cx-matchmaking .mm-play-panel-top{display:flex;justify-content:space-between;align-items:center;padding:23px 28px;border-bottom:1px solid #7e688522} #cx-matchmaking .mm-play-format{font-size:22px;letter-spacing:2px;font-weight:700;color:#e6e1ed} #cx-matchmaking .mm-play-format>span{font-size:10px;letter-spacing:0;margin:0 9px;color:#91889b} #cx-matchmaking .mm-play-status{display:flex;align-items:center;gap:8px;font-size:10px;letter-spacing:1.1px;color:#a59aad} #cx-matchmaking .mm-play-status>span{width:6px;height:6px;border-radius:50%;background:#786b80} #cx-matchmaking .is-searching .mm-play-status{color:#96b9e9} #cx-matchmaking .is-searching .mm-play-status>span{background:#8bbcff;box-shadow:0 0 10px #73a7ff66} #cx-matchmaking .mm-play-centre{text-align:center;padding:24px 22px 21px} #cx-matchmaking .mm-play-kicker{display:block;font-size:10px;letter-spacing:1.7px;color:#a49daf} #cx-matchmaking .mm-play-time{font-size:68px;line-height:1.2;letter-spacing:-2px;font-weight:650;color:#f5f2f8;margin:9px 0 8px;font-variant-numeric:tabular-nums} #cx-matchmaking .mm-play-centre h2{font-size:19px!important;margin:9px 0;color:#e2e3ef} #cx-matchmaking .mm-play-centre p{font-size:12px;line-height:1.6;color:#a49cab;max-width:340px;margin:0 auto} #cx-matchmaking .mm-play-wave{height:27px;display:flex;justify-content:center;align-items:center;gap:5px;margin-bottom:18px} #cx-matchmaking .mm-play-wave i{width:3px;height:6px;background:#7c6d86;border-radius:2px} #cx-matchmaking .is-searching .mm-play-wave i{background:#8dbaff;animation:mm-play-wave 1.2s ease-in-out infinite} #cx-matchmaking .is-searching .mm-play-wave i:nth-child(2){animation-delay:.12s} #cx-matchmaking .is-searching .mm-play-wave i:nth-child(3){animation-delay:.24s} #cx-matchmaking .is-searching .mm-play-wave i:nth-child(4){animation-delay:.36s} #cx-matchmaking .is-searching .mm-play-wave i:nth-child(5){animation-delay:.48s} #cx-matchmaking .mm-play-seats{text-align:center;padding:2px 18px 20px;color:#d6d1de;font-size:14px} #cx-matchmaking .mm-player-seats{display:flex;justify-content:center;gap:6px;margin:0 0 14px} #cx-matchmaking .mm-player-seat{width:33px;height:38px;border:1px solid #62556d55;border-radius:5px;display:grid;place-items:center;color:#756a80;background:#3a303b55;font-size:17px} #cx-matchmaking .mm-player-seat:nth-child(5){margin-right:12px} #cx-matchmaking .mm-player-seat.is-filled{color:#b2d0fa;border-color:#6487b9;background:#30486a;box-shadow:inset 0 0 12px #76adff16;animation:mm-seat-enter .35s ease-out} #cx-matchmaking .mm-play-seats small{color:#9e93aa;font-size:11px} #cx-matchmaking .mm-play-controls{text-align:center;padding:0 20px 22px} #cx-matchmaking .mm-play-button{display:inline-flex;justify-content:center;align-items:center;min-width:240px;min-height:46px} #cx-matchmaking .is-searching .mm-play-button{border-color:#6e87af;background:#304360;color:#d6e5ff} #cx-matchmaking .mm-play-controls p{font-size:10px;color:#9b8ca5;margin:12px 0 0} #cx-matchmaking .mm-play-scan{height:3px;position:relative;background:#5f506c55;overflow:hidden} #cx-matchmaking .mm-play-scan span{display:block;position:absolute;height:100%;width:35%;background:linear-gradient(90deg,transparent,#85b4ff,transparent);opacity:0} #cx-matchmaking .is-searching .mm-play-scan span{opacity:1;animation:mm-play-scan 2.3s ease-in-out infinite} #cx-matchmaking .mm-play-meta{display:grid;grid-template-columns:repeat(3,1fr);margin-top:17px;border:1px solid #51404d;border-radius:9px;background:#28212b} #cx-matchmaking .mm-play-meta>div{padding:17px 20px;border-right:1px solid #51404d} #cx-matchmaking .mm-play-meta>div:last-child{border:0} #cx-matchmaking .mm-play-meta span{display:block;color:#a797ae;font-size:9px;letter-spacing:1px} #cx-matchmaking .mm-play-meta strong{display:block;font-size:21px;color:#eae1ef;margin-top:8px} #cx-matchmaking .mm-play-note{font-size:11px;line-height:1.6;margin-top:15px} #cx-matchmaking.mm-has-queue{padding-bottom:100px} #cx-matchmaking #mm-queue-dock{position:fixed;bottom:20px;right:24px;z-index:80;display:flex;align-items:center;gap:20px;justify-content:space-between;width:320px;max-width:calc(100vw - 24px);padding:15px 17px;background:#242b3b;border:1px solid #658ac0;border-radius:9px;box-shadow:0 10px 35px #0008;animation:mm-dock-enter .25s ease-out} #cx-matchmaking #mm-queue-dock>a{display:flex;align-items:center;gap:12px;text-decoration:none;color:#e2ecff} #cx-matchmaking #mm-queue-dock strong{display:block;font-size:12px} #cx-matchmaking #mm-queue-dock small{display:block;font-size:10px;margin-top:6px;color:#a6bde0;font-variant-numeric:tabular-nums} #cx-matchmaking #mm-queue-dock button{font-size:10px;padding:8px 10px;border-color:#5b6e8b;min-height:32px} #cx-matchmaking .mm-queue-signal{height:12px;width:12px;border-radius:50%;background:#83b2fa;box-shadow:0 0 0 5px #7fb0ff18;animation:mm-queue-signal 2s ease-in-out infinite} #cx-matchmaking #mm-ready-check{box-sizing:border-box;position:fixed;inset:0;margin:auto;max-height:calc(100dvh - 28px);overflow:auto;width:460px;max-width:calc(100vw - 28px);padding:37px 30px 27px;background:radial-gradient(ellipse at 50% 0%,#bc733126,transparent 65%),#242129;border:1px solid #a97443;border-radius:13px;color:#f1e9df;text-align:center;box-shadow:0 24px 120px #000b;animation:mm-ready-enter .3s ease-out} #cx-matchmaking #mm-ready-check::backdrop{background:#08070bc9;backdrop-filter:blur(5px)} #cx-matchmaking .mm-ready-minimise{position:absolute;right:13px;top:12px;border:0;background:transparent;color:#9a8e90;padding:6px;font-size:19px;cursor:pointer} #cx-matchmaking .mm-ready-symbol{display:grid;place-items:center;width:60px;height:60px;margin:2px auto 22px;border:1px solid #b5814b;border-radius:16px;background:#7d4c252f;color:#edb574;font-size:31px;box-shadow:0 0 30px #e9a25a0f} #cx-matchmaking #mm-ready-title{font-size:28px;margin:11px 0 10px;color:#fff3e4} #cx-matchmaking .mm-ready-caption{font-size:13px;color:#b6a9a4;margin:0 0 24px} #cx-matchmaking .mm-ready-players{display:flex;justify-content:center;gap:5px;margin:0 auto 24px} #cx-matchmaking .mm-ready-players>span{display:grid;place-items:center;width:30px;height:32px;border:1px solid #74625955;border-radius:4px;font-size:17px;color:#847471;background:#3f332f55} #cx-matchmaking .mm-ready-players>span.is-ready{color:#b8dec2;border-color:#729b7c;background:#344a3b;animation:mm-seat-enter .3s ease-out} #cx-matchmaking .mm-ready-time strong{display:block;font-size:35px;color:#efd4b0;font-variant-numeric:tabular-nums} #cx-matchmaking .mm-ready-time>span{display:block;color:#ae9990;font-size:10px;margin:4px 0 24px} #cx-matchmaking #mm-ready-check .mm-ready-accept{display:block;width:100%;min-height:48px;background:#d19a58;border-color:#e6ba82;color:#251e16;font-size:14px;font-weight:600} #cx-matchmaking #mm-ready-check .mm-ready-accept:hover{background:#e2b173} #cx-matchmaking #mm-ready-check .mm-ready-accept:disabled{background:#404b3e;color:#bbd1bc;border-color:#698263;cursor:default} #cx-matchmaking .mm-ready-footnote{font-size:10px;line-height:1.7;color:#a48f86;margin:15px 0 0} #cx-matchmaking.mm-page-hidden .mm-play-panel *,#cx-matchmaking.mm-page-hidden .mm-queue-signal{animation-play-state:paused!important} @keyframes mm-play-wave{0%,100%{transform:scaleY(1);opacity:.45}50%{transform:scaleY(3.5);opacity:1}} @keyframes mm-play-scan{0%{transform:translateX(-100%)}100%{transform:translateX(390%)}} @keyframes mm-seat-enter{from{transform:translateY(5px);opacity:.4}to{transform:translateY(0);opacity:1}} @keyframes mm-dock-enter{from{transform:translateY(8px);opacity:.4}to{transform:translateY(0);opacity:1}} @keyframes mm-queue-signal{50%{box-shadow:0 0 0 8px #7fb0ff08}} @keyframes mm-ready-enter{from{transform:translateY(9px) scale(.98);opacity:.4}to{transform:translateY(0) scale(1);opacity:1}} @media(max-width:600px){#cx-matchmaking .mm-play-panel-top{padding:17px}#cx-matchmaking .mm-play-status{font-size:9px;letter-spacing:.6px}#cx-matchmaking .mm-play-time{font-size:54px}#cx-matchmaking .mm-play-centre{padding:22px 17px}#cx-matchmaking .mm-play-centre h2{font-size:18px!important}#cx-matchmaking .mm-player-seats{gap:4px}#cx-matchmaking .mm-player-seat{width:calc((100% - 44px)/10);height:31px;font-size:13px}#cx-matchmaking .mm-player-seat:nth-child(5){margin-right:4px}#cx-matchmaking .mm-play-button{min-width:0;width:100%}#cx-matchmaking .mm-play-meta>div{padding:14px 12px}#cx-matchmaking .mm-play-meta strong{font-size:18px}#cx-matchmaking #mm-queue-dock{bottom:12px;right:12px;left:12px;width:auto}#cx-matchmaking #mm-ready-check{padding:30px 18px 22px}#cx-matchmaking .mm-ready-players{gap:4px}#cx-matchmaking .mm-ready-players>span{width:calc((100% - 36px)/10);height:29px;font-size:14px}} @media(prefers-reduced-motion:reduce){#cx-matchmaking .mm-play-panel *,#cx-matchmaking .mm-player-seat,#cx-matchmaking #mm-queue-dock,#cx-matchmaking .mm-queue-signal,#cx-matchmaking #mm-ready-check,#cx-matchmaking .mm-ready-players>span{animation:none!important;transition:none!important}} #cx-matchmaking .mm-sound-toggle{display:flex;align-items:center;justify-content:center;gap:7px;margin:12px auto 0;padding:6px 10px;border:0;background:transparent;color:#b8adbf;font-size:11px;cursor:pointer}#cx-matchmaking .mm-sound-toggle i{font-size:17px}#cx-matchmaking .mm-sound-toggle:focus-visible{outline:2px solid #91b7ed;outline-offset:3px} #cx-matchmaking #mm-rule-appeal > .mm-outline { min-height: 44px; max-width: 100%; box-sizing: border-box; margin: 16px 0 0; padding: 9px 14px; border-radius: 8px; gap: 10px; text-align: left; text-decoration: none; } #cx-matchmaking #mm-rule-appeal > .mm-outline .mm-icon { color: #ff8798; } #cx-matchmaking #mm-rule-appeal > .mm-outline:focus-visible { outline: 2px solid #ff8798; outline-offset: 3px; } /* Rules read as a single document, with a distinct launch notice. */ #cx-matchmaking:has([data-tab="rules"].active) #mm-view > .mm-card { margin: 0; padding: 22px 0; border: 0; border-top: 1px solid var(--mm-border); border-radius: 0; background: transparent; } #cx-matchmaking:has([data-tab="rules"].active) #mm-view > .mm-card:not([id]) { padding: 13px 16px; border: 1px solid #64434d; border-left: 3px solid #df748c; border-radius: 6px; background: #382831; margin: 0 0 10px; } #cx-matchmaking #mm-view > [id^="mm-rule-"] > h2 { font-size: clamp(17px, 1.5vw, 21px); margin: 0 0 10px; } #cx-matchmaking:has([data-tab="rules"].active) #mm-view > .mm-card p { max-width: 77ch; color: #d2c5cd; font-weight: 450; line-height: 1.7; margin: 0; } #cx-matchmaking:has([data-tab="rules"].active) #mm-view > .mm-card p + p { margin-top: 8px; } /* Reuse the site's Mirage image on the idle match screen. */ #cx-matchmaking .mm-play-panel:not(.is-searching) { background: linear-gradient(180deg,#251d2499 0%,#261e25ee 53%,#261e25 80%), #261e25 url('/mix/assets/maps/mirage.jpg') center 30% / cover no-repeat; } #cx-matchmaking .mm-play-panel:not(.is-searching) .mm-play-centre { padding-bottom: 22px; } #cx-matchmaking .mm-play-panel:not(.is-searching) .mm-play-kicker, #cx-matchmaking .mm-play-panel:not(.is-searching) .mm-play-time { display: none; } #cx-matchmaking .mm-play-panel:not(.is-searching) .mm-play-centre h2 { font-size: clamp(22px, 3vw, 35px); letter-spacing: -.025em; } /* Readable queue text on both the artwork and the active search panel. */ #cx-matchmaking .mm-play-status { color: #ded1dc; font-size: 12px; letter-spacing: .025em } #cx-matchmaking .mm-play-status > span { background: #ff9db0 } #cx-matchmaking .is-searching .mm-play-status { color: #c0d7fb } #cx-matchmaking .mm-play-centre p, #cx-matchmaking .mm-play-seats > span small, #cx-matchmaking .mm-play-controls > p, #cx-matchmaking .mm-sound-toggle, #cx-matchmaking .mm-play-meta span, #cx-matchmaking .mm-play-kicker { color: #d5c9d6; font-size: 13px; line-height: 1.45 } #cx-matchmaking .mm-play-meta span { letter-spacing: .025em } #cx-matchmaking .mm-play-format { font-size: 14px; letter-spacing: .015em } #cx-matchmaking .mm-sound-toggle { min-height: 38px } #cx-matchmaking .mm-play-note { color: #d5c9d6; font-size: 13px; line-height: 1.5 } #cx-matchmaking .mm-play-panel:not(.is-searching) .mm-play-wave { display: none } #cx-matchmaking .mm-list-empty { --mm-list-accent: #ff9aaf; display: grid; grid-template-columns: 48px minmax(0,1fr); align-items: start; gap: 18px; padding: 24px; border: 1px solid var(--mm-border); border-radius: 10px; background: #2b242a; } #cx-matchmaking .mm-list-empty--rating { --mm-list-accent: #f1c78e; background: #2e2729 } #cx-matchmaking .mm-list-empty--matches { --mm-list-accent: #b7c5ed; background: #2a2530 } #cx-matchmaking .mm-list-mark { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 10px; color: var(--mm-list-accent); background: #1e191e; border: 1px solid #65505e; } #cx-matchmaking .mm-list-mark .mm-icon { font-size: 23px } #cx-matchmaking .mm-list-empty h3 { margin: 0 0 5px; font-size: 18px } #cx-matchmaking .mm-list-empty p { margin: 0 0 15px; color: #d5c9d6; line-height: 1.5 } #cx-matchmaking .mm-list-empty :is(.mm-outline,.mm-primary) { min-height: 42px; text-decoration: none; max-width: 100% } #cx-matchmaking .mm-lobby-list { gap: 12px } #cx-matchmaking .mm-lobby-entry { display: grid; grid-template-rows: auto auto 1fr auto auto; gap: 12px; margin: 0; padding: 17px; border-radius: 9px; color: #f9edf3; text-decoration: none; } #cx-matchmaking .mm-lobby-entry h3 { margin: 0; font-size: 17px; overflow-wrap: anywhere } #cx-matchmaking .mm-lobby-meta,#cx-matchmaking .mm-lobby-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px } #cx-matchmaking .mm-format { font-variant-numeric: tabular-nums; font-weight: 750; color: #efadbe } #cx-matchmaking .mm-lobby-state { display: inline-block; padding: 3px 8px; border-radius: 6px; background: #41303a; color: #f6c2d2; font-size: 12px; line-height: 1.35; text-align: center; } #cx-matchmaking .mm-lobby-state[data-state="veto"] { background: #493a2c; color: #f3d3a1 } #cx-matchmaking .mm-lobby-state:is([data-state="ready"],[data-state="live"]) { background: #2c4338; color: #c4e8ce } #cx-matchmaking .mm-lobby-teams { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); gap: 9px; align-items: center; color: #e5d6e0 } #cx-matchmaking .mm-lobby-teams > span { overflow-wrap: anywhere } #cx-matchmaking .mm-lobby-teams > span:last-child { text-align: right } #cx-matchmaking .mm-lobby-versus { color: #a595a3; font-size: 14px } #cx-matchmaking .mm-lobby-footer { font-size: 12px; color: #d5c9d6 } #cx-matchmaking .mm-lobby-footer strong { color: #fff3f8 } #cx-matchmaking .mm-lobby-footer .mm-icon { color: #ff9aaf } #cx-matchmaking .mm-lobby-progress { width: 100%; height: 4px; appearance: none; border: 0; border-radius: 4px; overflow: hidden; background: #4c3b48 } #cx-matchmaking .mm-lobby-progress::-webkit-progress-bar { background: #4c3b48 } #cx-matchmaking .mm-lobby-progress::-webkit-progress-value { background: #e8819b; border-radius: 4px } #cx-matchmaking .mm-lobby-progress::-moz-progress-bar { background: #e8819b; border-radius: 4px } #cx-matchmaking .mm-rank-list { border: 1px solid var(--mm-border); border-radius: 9px; overflow: hidden } #cx-matchmaking .mm-rank-list table { width: 100%; table-layout: fixed; font-variant-numeric: tabular-nums } #cx-matchmaking .mm-rank-list :is(th,td) { padding: 12px 10px; white-space: normal; vertical-align: middle } #cx-matchmaking .mm-rank-list thead th { background: #332a32; color: #e0ceda; font-size: 12px; letter-spacing: 0 } #cx-matchmaking .mm-rank-list :is(th,td):first-child { width: 13%; text-align: center } #cx-matchmaking .mm-rank-list :is(th,td):nth-child(3) { width: 21%; text-align: right } #cx-matchmaking .mm-rank-list :is(th,td):last-child { width: 23%; text-align: right } #cx-matchmaking .mm-rank-list tbody tr:last-child > * { border-bottom: 0 } #cx-matchmaking .mm-rank-list tbody tr:nth-child(even) { background: #302830 } #cx-matchmaking .mm-rank-team { display: grid; gap: 2px; text-transform: none; letter-spacing: 0; font-size: 14px; overflow-wrap: anywhere } #cx-matchmaking .mm-rank-team strong { color: #f8edf4 } #cx-matchmaking .mm-rank-team > span,#cx-matchmaking .mm-rank-record,#cx-matchmaking .mm-rank-list thead small { display: block; color: #c8b8c6; font-size: 11px } #cx-matchmaking .mm-rank-place { display: inline-grid; place-items: center; min-width: 25px; min-height: 25px; color: #ddcfdb } #cx-matchmaking .mm-rank-list tbody tr:nth-child(-n+3) .mm-rank-place { border-radius: 6px; background: #4b392f; color: #f2ca93; font-weight: 800 } #cx-matchmaking .mm-rank-elo { color: #f3b0c0; font-weight: 800 } #cx-matchmaking .mm-match-list { display: grid; gap: 10px } #cx-matchmaking .mm-match-entry { position: relative; display: grid; grid-template-columns: 100px minmax(0,1fr) 18px; gap: 14px; align-items: center; padding: 11px 13px; border: 1px solid var(--mm-border); border-radius: 9px; background: #2b242b; color: #f7edf3; text-decoration: none; } #cx-matchmaking .mm-match-entry:hover { border-color: #986078; color: #fff } #cx-matchmaking .mm-match-entry > .mm-icon { color: #ff9aaf } #cx-matchmaking .mm-match-map { display: block; width: 100%; height: 72px; object-fit: cover; border-radius: 5px; background: #1f1a20 } #cx-matchmaking .mm-match-info { min-width: 0 } #cx-matchmaking .mm-match-meta { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 2px 10px; margin-bottom: 7px; overflow-wrap: anywhere } #cx-matchmaking .mm-match-meta time { color: #c8b8c6; font-size: 11px } #cx-matchmaking .mm-match-teams { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: start; gap: 9px } #cx-matchmaking .mm-match-side { display: grid; gap: 1px; min-width: 0; overflow-wrap: anywhere } #cx-matchmaking .mm-match-side:last-child { text-align: right } #cx-matchmaking .mm-match-result { display: flex; gap: 5px; align-items: center; white-space: nowrap; color: #ded0db; font-size: 19px; font-weight: 800; line-height: 1.15; font-variant-numeric: tabular-nums } #cx-matchmaking .mm-match-result .is-winner { color: #fff2f7 } #cx-matchmaking .mm-rating-delta { font-size: 11px; color: #c8b8c6; white-space: nowrap } #cx-matchmaking .mm-rating-delta[data-change="up"] { color: #a8dfba } #cx-matchmaking .mm-rating-delta[data-change="down"] { color: #ffabb9 } #cx-matchmaking :is(.mm-match-entry,.mm-lobby-entry):focus-visible { outline: 2px solid #ff9aaf; outline-offset: 2px } @media(max-width:650px) { #cx-matchmaking .mm-lobby-list { grid-template-columns: minmax(0,1fr) } #cx-matchmaking .mm-list-empty { grid-template-columns: 36px minmax(0,1fr); gap: 12px; padding: 16px } #cx-matchmaking .mm-list-mark { width: 36px; height: 36px } #cx-matchmaking .mm-list-mark .mm-icon { font-size: 20px } #cx-matchmaking .mm-list-empty h3 { font-size: 16px } #cx-matchmaking .mm-match-entry { grid-template-columns: minmax(0,1fr) 16px; gap: 7px; padding: 11px } #cx-matchmaking .mm-match-map { position: absolute; width: 46px; height: 34px; top: 11px; left: 11px } #cx-matchmaking .mm-match-meta { min-height: 34px; padding-left: 55px; padding-right: 6px; margin-bottom: 10px } #cx-matchmaking .mm-rank-list :is(th,td) { padding: 10px 5px } #cx-matchmaking .mm-rank-team { font-size: 13px } #cx-matchmaking .mm-rank-place { min-width: 20px; min-height: 22px } } @media(prefers-reduced-motion:reduce) { #cx-matchmaking .mm-lobby-entry:hover { transform: none; transition: none } } /* Server selectors; native administrator rows use the main site's styles. */ #cx-matchmaking .mm-admins-native,#cx-matchmaking .mm-admins-native * {font-family:Montserrat,Arial,sans-serif!important;} #cx-matchmaking .mm-admins-native {min-width:0;font-size:11px;line-height:20px;font-weight:700;color:#736a6e;} #cx-matchmaking .mm-admins-native .bx,#cx-matchmaking .mm-admins-native .bx::before {font-family:boxicons!important;} #cx-matchmaking .mm-admins-native .vertical_navigation_bms {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 20px;padding:0;list-style:none;} #cx-matchmaking .mm-admins-native .vertical_navigation_bms li {float:none;width:auto;min-width:0;margin:0;} #cx-matchmaking .mm-admins-native .vertical_navigation_bms li a {display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;min-height:60px;margin:0;padding:11px 12px;border:1px solid #493d44;border-radius:9px;background:#30292d;text-transform:none;font:500 12px/1.4 Montserrat,Arial,sans-serif;color:#b4a9af;transition:background .15s,border-color .15s;} #cx-matchmaking .mm-admins-native .vertical_navigation_bms li a::before {display:none;} #cx-matchmaking .mm-admins-native .vertical_navigation_bms li a strong {font:600 13px/1.3 Montserrat,Arial,sans-serif;color:inherit;} #cx-matchmaking .mm-admins-native .mm-admin-address {font:11px/1.4 Consolas,monospace;letter-spacing:-.2px;color:#a99da4;white-space:nowrap;} #cx-matchmaking .mm-admins-native .vertical_navigation_bms li a:hover {background:#393135;border-color:#5a4e54;} #cx-matchmaking .mm-admins-native .vertical_navigation_bms li.active a {background:#42393d;border-color:#65555e;color:#fff;box-shadow:none;} #cx-matchmaking .mm-admins-native .vertical_navigation_bms li.active .mm-admin-address {color:#c7bdc3;} /* Match the main page's native paragraph metrics; MM resets them globally. */ #cx-matchmaking .mm-admins-native .table-adaptive .table-row>.row>div.with-description>p {font:600 12px/22px Montserrat,Arial,sans-serif;margin:15px 0 0;color:#fff;} #cx-matchmaking .mm-admins-native .table-adaptive .table-row>.row>div.with-description>span {font:700 10.5px/20px Montserrat,Arial,sans-serif;} #cx-matchmaking .mm-admins-native .mm-admins-empty {padding:22px;color:#b4a9af;font-size:12px;} @media(min-width:1400px){#cx-matchmaking .mm-admins-native .vertical_navigation_bms {grid-template-columns:repeat(6,minmax(0,1fr));}} @media(max-width:650px){#cx-matchmaking .mm-admins-native .vertical_navigation_bms {grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-bottom:16px;}#cx-matchmaking .mm-admins-native .vertical_navigation_bms li a {padding:10px 9px;}#cx-matchmaking .mm-admins-native .mm-admin-address {font-size:10px;}} /* Match the site accent for status and expiry icons. */ #cx-matchmaking .mm-admins-native .table-row>.row>div:first-child>i, #cx-matchmaking .mm-admins-native .mm-admin-expiry>i { color:#ff8699;background:rgba(255,119,143,.09);border:1px solid rgba(255,119,143,.14); } /* A single server switcher, without the site's inherited tab divider. */ #cx-matchmaking .mm-admins-native .vertical_navigation_bms { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px; margin:0 0 22px;padding:5px;border:0!important;border-radius:11px; background:#211d20;box-shadow:none;overflow:visible; } #cx-matchmaking .mm-admins-native .vertical_navigation_bms::before, #cx-matchmaking .mm-admins-native .vertical_navigation_bms::after, #cx-matchmaking .mm-admins-native .vertical_navigation_bms li::before, #cx-matchmaking .mm-admins-native .vertical_navigation_bms li::after, #cx-matchmaking .mm-admins-native .vertical_navigation_bms li a::before, #cx-matchmaking .mm-admins-native .vertical_navigation_bms li a::after {display:none!important;content:none!important;} #cx-matchmaking .mm-admins-native .vertical_navigation_bms li {float:none;width:auto;min-width:0;margin:0;padding:0;border:0;background:none;} #cx-matchmaking .mm-admins-native .vertical_navigation_bms li a { display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px; min-height:62px;margin:0;padding:11px 13px;border:0!important;border-radius:8px; background:transparent;color:#aaa0a5;box-shadow:none!important;text-transform:none; font:500 12px/1.4 Montserrat,Arial,sans-serif;transition:background .15s,color .15s; } #cx-matchmaking .mm-admins-native .vertical_navigation_bms li a:hover {background:#332c30;color:#e5dbe1;} #cx-matchmaking .mm-admins-native .vertical_navigation_bms li.active a {background:#453a40;color:#fff;} #cx-matchmaking .mm-admins-native .vertical_navigation_bms li a strong {font:600 13px/1.3 Montserrat,Arial,sans-serif;color:inherit;} #cx-matchmaking .mm-admins-native .mm-admin-address {font:11px/1.4 Consolas,monospace;letter-spacing:-.2px;color:#9f959c;white-space:nowrap;} #cx-matchmaking .mm-admins-native .vertical_navigation_bms li.active .mm-admin-address {color:#cbbfc6;} @media(min-width:1400px){#cx-matchmaking .mm-admins-native .vertical_navigation_bms{grid-template-columns:repeat(6,minmax(0,1fr));}} @media(max-width:650px){#cx-matchmaking .mm-admins-native .vertical_navigation_bms{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:16px;}#cx-matchmaking .mm-admins-native .vertical_navigation_bms li a{padding:10px 8px;}#cx-matchmaking .mm-admins-native .mm-admin-address{font-size:10px;}} #cx-matchmaking .mm-punishment-tools{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 18px;flex-wrap:wrap} #cx-matchmaking .mm-punishment-tabs{display:flex;padding:4px;border-radius:9px;background:#211d20;gap:4px} #cx-matchmaking .mm-punishment-tabs a{display:flex;align-items:center;gap:7px;color:#b0a5ad;padding:10px 16px;border-radius:6px;font-size:12px;text-decoration:none} #cx-matchmaking .mm-punishment-tabs a.active{background:#453a40;color:#fff} #cx-matchmaking .mm-punishment-search{display:flex;gap:7px;margin:0!important;max-width:100%} #cx-matchmaking .mm-punishment-search input{min-width:0;width:230px;height:38px;margin:0!important;background:#211d20;color:#eee;border:1px solid #ffffff12;border-radius:7px;padding:0 12px;font:12px Montserrat,Arial,sans-serif} #cx-matchmaking .mm-punishment-search button{min-width:38px;padding:8px} #cx-matchmaking .mm-punishment-counts{display:flex;gap:20px;flex-wrap:wrap;font-size:11px;color:#a99ea6;padding:0 0 17px} #cx-matchmaking .mm-punishment-counts strong{font-weight:600;color:#e4d9df;margin-left:5px} #cx-matchmaking .mm-punishment-table{overflow-x:auto;border:1px solid #ffffff0b;border-radius:10px} #cx-matchmaking .mm-punishment-table table{width:100%;table-layout:fixed;border-collapse:collapse;font-size:11px;line-height:1.7} #cx-matchmaking .mm-punishment-table th{color:#a69ba3;font-weight:500;text-align:left;background:#211d20;padding:12px 15px} #cx-matchmaking .mm-punishment-table td{padding:14px 15px;border-top:1px solid #ffffff08;vertical-align:top;overflow-wrap:anywhere;color:#d8cdd5} #cx-matchmaking .mm-punishment-table th:nth-child(1){width:25%}#cx-matchmaking .mm-punishment-table th:nth-child(2){width:33%}#cx-matchmaking .mm-punishment-table th:nth-child(3){width:20%}#cx-matchmaking .mm-punishment-table th:nth-child(4){width:22%} #cx-matchmaking .mm-punishment-table td strong{display:block;font-weight:500;color:#eee} #cx-matchmaking .mm-punishment-table td small{display:block;color:#978a94;font-size:10px;margin-top:6px} #cx-matchmaking .mm-punishment-status{display:inline-block;font-size:10px;color:#b7b0b6;background:#ffffff06;padding:3px 7px;border-radius:5px} #cx-matchmaking .mm-punishment-status[data-status=active]{color:#eaa0ab;background:#ec8b9d13} #cx-matchmaking .mm-punishment-pagination{display:flex;align-items:center;justify-content:center;gap:15px;font-size:11px;color:#a497a2;margin-top:20px} @media(max-width:650px){#cx-matchmaking .mm-punishment-search{width:100%}#cx-matchmaking .mm-punishment-search input{flex:1;width:0}#cx-matchmaking .mm-punishment-table table{min-width:630px}#cx-matchmaking .mm-punishment-counts{gap:9px 14px}} #cx-matchmaking .mm-punishment-table tbody tr{background:transparent!important}#cx-matchmaking .mm-punishment-table tbody tr:nth-child(even){background:#ffffff02!important}#cx-matchmaking .mm-punishment-table tbody tr:hover{background:#ffffff05!important} @media(max-width:650px){ #cx-matchmaking .mm-punishment-table{overflow:visible} #cx-matchmaking .mm-punishment-table table{min-width:0;display:block;width:100%} #cx-matchmaking .mm-punishment-table thead{display:none} #cx-matchmaking .mm-punishment-table tbody{display:block} #cx-matchmaking .mm-punishment-table tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding:14px;gap:12px;border-top:1px solid #ffffff0b} #cx-matchmaking .mm-punishment-table tbody tr:first-child{border-top:0} #cx-matchmaking .mm-punishment-table td{display:block;padding:0;border:0;min-width:0} #cx-matchmaking .mm-punishment-table td:nth-child(-n+2){grid-column:1/-1} #cx-matchmaking .mm-punishment-table td:first-child strong{font-size:12px} #cx-matchmaking .mm-punishment-table td:nth-child(2){color:#a99da6} #cx-matchmaking .mm-punishment-table td[data-label]::before{content:attr(data-label);display:block;color:#978a94;font-size:10px;margin-bottom:5px} } /* Punishments: reuse the main site's block, counters and native rows. */ #cx-matchmaking .mm-punishments-native,#cx-matchmaking .mm-punishments-native *{font-family:Montserrat,Arial,sans-serif!important} #cx-matchmaking .mm-punishments-native .bx,#cx-matchmaking .mm-punishments-native .bx::before{font-family:boxicons!important} #cx-matchmaking .mm-punishments-native .block_select_servers_blocked_two{margin-bottom:20px} #cx-matchmaking .mm-punishments-native .flex_servers_block_bms{gap:18px;flex-wrap:wrap} #cx-matchmaking .mm-punishments-native .block_head_vert_al>.bx{display:flex;align-items:center;justify-content:center;flex:0 0 45px;width:45px;height:45px;line-height:45px;font-size:19px;margin:0 17px 0 0} #cx-matchmaking .mm-punishments-native .flex_vert_al small{font-size:12px;line-height:17px;color:#a39a9f;font-weight:600} #cx-matchmaking .mm-punishments-native .mm-punishment-tabs{padding:10px 0 0;border-top:1px solid #393134;background:transparent;border-radius:0} #cx-matchmaking .mm-punishments-native .mm-punishment-tabs a{padding:8px 15px;border-radius:7px;font-weight:600} #cx-matchmaking .mm-punishments-native .mm-punishment-tabs a.active{background:#4b3a42;color:#ffb5c1} #cx-matchmaking .mm-punishments-native .mm-punishment-search{position:relative;gap:0;max-width:100%} #cx-matchmaking .mm-punishments-native .mm-punishment-search input{height:42px;width:250px;padding:0 44px 0 14px;border-radius:9px;background:#3b3236;border:1px solid #4d4147} #cx-matchmaking .mm-punishments-native .mm-punishment-search input:focus{outline:1px solid #b86b81;outline-offset:1px} #cx-matchmaking .mm-punishments-native .mm-punishment-search button{position:absolute;right:0;top:0;width:42px;height:42px;border:0;background:none;color:#c0aab4;padding:10px;cursor:pointer} #cx-matchmaking .mm-punishments-native .block_solution{padding:0;background:transparent} #cx-matchmaking .mm-punishments-native .block_stats_bans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:0 0 20px} #cx-matchmaking .mm-punishments-native .stats_info_bans{min-width:0} #cx-matchmaking .mm-punishments-native .text_bans{color:#fff} #cx-matchmaking .mm-punishments-native .info_text_bans,#cx-matchmaking .mm-punishments-native .info_text_bans_r{font-size:10px;white-space:nowrap;line-height:18px} #cx-matchmaking .mm-punishments-native .line_info_stats,#cx-matchmaking .mm-punishments-native .line_info_stats_r{flex-shrink:0} #cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row{margin:0} #cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>div{min-width:0;padding:0 12px;box-sizing:border-box;flex:1 1 25%;max-width:25%;width:auto} #cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>div>p{width:100%;max-width:100%;font:600 12px/22px Montserrat,Arial,sans-serif;margin:15px 0 0;color:#fff;top:-7px} #cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>div>span{font:700 10.5px/20px Montserrat,Arial,sans-serif} #cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>.mm-punishment-player{padding-left:44px;position:relative} #cx-matchmaking .mm-punishments-native .mm-punishment-player>p>.bx{position:absolute;left:1px;top:9px;width:33px;height:33px;box-sizing:border-box;line-height:15px;padding:9px;border-radius:9px;color:#ff8c9f;background:#ff798f20;font-size:15px} #cx-matchmaking .mm-punishments-native .mm-punishment-player>p{position:static!important;padding-top:8px!important;margin-top:0!important;height:37px} #cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>.mm-punishment-player>span{top:-9px} #cx-matchmaking .mm-punishments-native .mm-punishment-row em{font-style:normal;color:#a8dca1} #cx-matchmaking .mm-punishments-native .mm-punishment-row em[data-status="expired"]{color:#b8aeb4} #cx-matchmaking .mm-punishments-native .mm-punishment-row em[data-status="removed"]{color:#a1bfdc} #cx-matchmaking .mm-punishments-native .mm-punishment-row.is-mute>div{flex:1 1 20%;max-width:20%} #cx-matchmaking .mm-punishments-native .empty-element{padding:28px 18px;margin:0;color:#afa2aa;font-size:12px;background:#3b3336;border-radius:11px} @media(max-width:1100px){#cx-matchmaking .mm-punishments-native .block_stats_bans{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:991px){ #cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row{height:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px;margin:0} #cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>div,#cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row.is-mute>div{width:100%;max-width:100%;height:auto;min-height:38px;padding:0!important;margin:0} #cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>div>p,#cx-matchmaking .mm-punishments-native .mm-punishment-player>p{display:block;position:static!important;top:auto;margin:0!important;padding:0!important;white-space:normal;overflow-wrap:anywhere;height:auto;line-height:20px;overflow:visible} #cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>div>span{display:block;position:static;top:auto;font-size:10px;line-height:18px} #cx-matchmaking .mm-punishments-native .mm-punishment-player>p>.bx{display:none} #cx-matchmaking .mm-punishments-native .table-row{padding:16px} } @media(max-width:480px){#cx-matchmaking .mm-punishments-native .block_select_servers_blocked_two{padding:14px}#cx-matchmaking .mm-punishments-native .mm-punishment-search,#cx-matchmaking .mm-punishments-native .mm-punishment-search input{width:100%}#cx-matchmaking .mm-punishments-native .block_stats_bans{gap:10px}#cx-matchmaking .mm-punishments-native .stats_info_bans{padding:0 10px}} /* Align every value and caption without inherited negative offsets. */ #cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row{height:56px} #cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>div{display:flex;flex-direction:column;justify-content:center;gap:3px;height:56px;margin:0} #cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>div>p,#cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>.mm-punishment-player>p{position:static!important;top:auto;margin:0!important;padding:0!important;height:auto;min-height:18px;line-height:18px;display:block} #cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>div>span,#cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>.mm-punishment-player>span{position:static;top:auto;display:block;line-height:14px;margin:0} #cx-matchmaking .mm-punishments-native .mm-punishment-player>p>.bx{top:50%;transform:translateY(-50%)} #cx-matchmaking .mm-punishments-native .mm-punishment-row em{font-variant-numeric:tabular-nums} @media(max-width:991px){#cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row{height:auto}#cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>div{height:auto;justify-content:flex-start}#cx-matchmaking .mm-punishments-native .table-row>.mm-punishment-row>div>p{line-height:20px}} #cx-matchmaking .mm-punishments-native .table-row[role="button"]{cursor:pointer} #cx-matchmaking .mm-punishments-native .table-row[role="button"]:focus-visible{outline:2px solid #c7758d;outline-offset:-2px} .mm-punishment-detail,.mm-punishment-detail *{font-family:Montserrat,Arial,sans-serif} .mm-punishment-detail .bx,.mm-punishment-detail .bx::before{font-family:boxicons!important} .mm-punishment-detail .modal-dialog{max-width:820px;margin:30px auto} .mm-punishment-detail .modal_bans{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px} .mm-punishment-detail .col_bamb{width:100%;min-width:0} .mm-punishment-detail .info_block_names{display:flex;gap:12px;align-items:flex-start;margin:0 0 18px} .mm-punishment-detail .info_block_names>.bx{flex:0 0 34px;width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:9px;color:#ff94a7;background:#ff80951a;font-size:17px} .mm-punishment-detail .flex_info_block_names{display:flex;flex-direction:column;gap:5px;min-width:0} .mm-punishment-detail .text_desp_info{font-size:10.5px;line-height:15px;color:#a89ba3;font-weight:500} .mm-punishment-detail .name_info_block{display:block;font-size:12px;line-height:20px;font-weight:600;color:#eee5ea;white-space:normal;overflow-wrap:anywhere} .mm-punishment-detail .modal-body{padding:24px} @media(max-width:600px){.mm-punishment-detail .modal-dialog{margin:12px;max-width:calc(100% - 24px)}.mm-punishment-detail .modal_bans{grid-template-columns:minmax(0,1fr);gap:0}.mm-punishment-detail .modal-body{padding:20px}.mm-punishment-detail .flex_modal_head{min-width:0}.mm-punishment-detail .flex_modal_head>span{font-size:15px}.mm-punishment-detail .info_block_names:last-child{margin-bottom:18px}} /* Rich team ranking cards */ #cx-matchmaking .mm-rank-cards{display:grid;gap:12px} #cx-matchmaking .mm-rank-card{position:relative;display:grid;grid-template-columns:72px 58px minmax(150px,1fr) minmax(290px,1.2fr);align-items:center;gap:16px;padding:18px 20px;border:1px solid #ffffff12;border-radius:14px;background:linear-gradient(120deg,#302830,#272127);box-shadow:0 10px 24px #0002;overflow:hidden;transition:transform .16s,border-color .16s,background .16s} #cx-matchmaking .mm-rank-card:hover{transform:translateY(-2px);border-color:#e8899d66;background:linear-gradient(120deg,#3a3038,#2a232a)} #cx-matchmaking .mm-rank-card.is-first{border-color:#e7ae6959;background:linear-gradient(120deg,#3b3031,#292329)} #cx-matchmaking .mm-rank-card.is-first:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:#f0bc79} #cx-matchmaking .mm-rank-card__place{display:grid;justify-items:center;gap:5px;color:#e9d7df;text-align:center} #cx-matchmaking .mm-rank-card__place span{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:#4b3b31;color:#f3ca93;font-size:18px;font-weight:800} #cx-matchmaking .mm-rank-card:not(.is-first):not(.is-second):not(.is-third) .mm-rank-card__place span{background:#393038;color:#d4c3ce} #cx-matchmaking .mm-rank-card__place small{font-size:8px;letter-spacing:.12em;color:#a997a6} #cx-matchmaking .mm-rank-card__emblem{display:grid;place-items:center;width:58px;height:58px;border-radius:15px;background:linear-gradient(145deg,#d9758b,#754a65);box-shadow:inset 0 1px #ffffff55,0 6px 14px #0003;color:#fff;font-size:19px;font-weight:800;letter-spacing:.04em} #cx-matchmaking .mm-rank-card.is-first .mm-rank-card__emblem{background:linear-gradient(145deg,#e5a967,#8d5b50)} #cx-matchmaking .mm-rank-card__identity{display:grid;gap:4px;min-width:0}.mm-rank-card__identity strong{color:#fff2f7;font-size:16px;overflow-wrap:anywhere}.mm-rank-card__identity span{color:#d4b6c7;font-size:11px;letter-spacing:.08em;text-transform:uppercase}.mm-rank-card__identity small{color:#978695;font-size:10px;margin-top:4px} #cx-matchmaking .mm-rank-card__stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.mm-rank-card__stats div{display:grid;gap:4px;padding-left:13px;border-left:1px solid #ffffff12}.mm-rank-card__stats strong{color:#f5e6ed;font-size:15px}.mm-rank-card__stats div:first-child strong{color:#f3afbf;font-size:18px}.mm-rank-card__stats span{color:#9e8d9b;font-size:8px;letter-spacing:.08em} @media(max-width:850px){#cx-matchmaking .mm-rank-card{grid-template-columns:52px 50px minmax(0,1fr);gap:12px;padding:14px}.mm-rank-card__emblem{width:50px;height:50px;border-radius:13px}.mm-rank-card__identity strong{font-size:14px}.mm-rank-card__stats{grid-column:1/-1;padding-top:10px;border-top:1px solid #ffffff10}.mm-rank-card__stats div{padding-left:9px}} @media(max-width:450px){#cx-matchmaking .mm-rank-card{grid-template-columns:36px 42px minmax(0,1fr);gap:10px;padding:12px}.mm-rank-card__place span{width:30px;height:30px;font-size:14px}.mm-rank-card__place small{font-size:7px}.mm-rank-card__emblem{width:42px;height:42px;font-size:14px}.mm-rank-card__identity{padding-left:3px;min-width:0}.mm-rank-card__identity strong{font-size:12px;word-break:break-word}.mm-rank-card__stats strong{font-size:13px}.mm-rank-card__stats div:first-child strong{font-size:15px}.mm-rank-card__stats span{font-size:7px}}