.cpTabs{display:flex;gap:7px;flex-wrap:wrap;margin:16px 0}.cpTabs button.active{background:#287d85;border-color:#84e8e6}.cpView[hidden]{display:none}.cpView article{overflow-wrap:anywhere}.cpClock{font-weight:700;color:#7fe4e0}.cpExpired{color:#ffb4b4}.cpView .hubRows a{display:inline-block;margin:6px 8px 6px 0}.cpView .hubRows button{font-size:.88rem;padding:7px 9px}.cpView h3{margin-bottom:6px}

.cpAccountGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:15px 0}.cpAccountGrid article,.cpPaymentMock{padding:12px;background:#12344b;border:1px solid #396782;border-radius:12px}.cpPaymentMock{display:grid;gap:8px;margin-top:15px}.cpPaymentMock span{opacity:.6;border:1px solid #31536a;border-radius:9px;padding:9px}.cpPaymentMock button:disabled{background:#2b4355}@media(max-width:680px){.cpAccountGrid{grid-template-columns:1fr}}

.cpRoleGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:16px 0}.cpRoleGrid article{border:1px solid #3c728c;background:#102e49;border-radius:12px;padding:12px}.cpRoleGrid h3{margin:0 0 8px;font-size:1.02rem}.cpRoleGrid p{font-size:.9rem;line-height:1.45;min-height:92px}.cpRoleGrid button{width:100%}.cpJoinForm{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:end}.cpJoinGuide{scroll-margin-top:12px}@media(max-width:900px){.cpRoleGrid{grid-template-columns:repeat(2,1fr)}.cpJoinForm{grid-template-columns:1fr 1fr}.cpJoinForm button{grid-column:1/-1}}@media(max-width:580px){.cpRoleGrid,.cpJoinForm{grid-template-columns:1fr}.cpRoleGrid p{min-height:0}}
.cpRoleGrid button.selected{background:#287d85;border-color:#9cf0ec}