:root{--cm-accent:#64ffda;--cm-accent-glow:#64ffda33;--cm-bg:#0a192f;--card-w:220px;--card-h:300px}.cards-manager-container{color:#fff;background:radial-gradient(circle,#1b2735 0%,#090a0f 100%);min-height:100vh;padding:60px 40px;font-family:Inter,sans-serif;position:relative;overflow-x:hidden}.cm-header{border-bottom:1px solid #64ffda1a;justify-content:space-between;align-items:flex-end;margin-bottom:60px;padding-bottom:20px;display:flex}.cm-title-group h1{letter-spacing:-2px;margin-bottom:10px;font-size:3rem;font-weight:900}.cm-title-group p{color:#fff6;text-transform:uppercase;letter-spacing:2px;font-size:.9rem}.create-btn{background:var(--cm-accent-glow);border:1px solid var(--cm-accent);color:var(--cm-accent);border-radius:8px;align-items:center;gap:10px;padding:12px 24px;font-weight:800;transition:all .3s;display:flex}.create-btn:hover{background:var(--cm-accent);color:#000;box-shadow:0 0 30px var(--cm-accent-glow)}.cards-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:40px;padding:20px 0;display:grid}.card-mini{aspect-ratio:.7;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;background:#141414cc;border:1px solid #ffffff1a;border-radius:15px;width:100%;transition:all .4s;position:relative;overflow:hidden}.card-mini-inner{flex-direction:column;height:100%;display:flex}.card-mini-img{background-position:50%;background-size:cover;flex:1;position:relative}.card-mini-overlay{background:linear-gradient(#0000 40%,#000c 100%);align-items:flex-end;padding:10px;display:flex;position:absolute;inset:0}.card-mini-class{text-transform:uppercase;letter-spacing:1px;border:1px solid var(--cm-accent);color:var(--cm-accent);background:#64ffda1a;border-radius:4px;align-items:center;gap:5px;padding:4px 8px;font-size:.65rem;display:flex}.card-mini-info{background:#00000080;padding:15px}.card-mini-info h3{white-space:nowrap;text-overflow:ellipsis;margin-bottom:8px;font-size:1rem;font-weight:700;overflow:hidden}.card-mini-stats{gap:15px;font-family:monospace;font-size:.75rem;font-weight:800;display:flex}.element-dot{border-radius:50%;width:12px;height:12px;position:absolute;top:15px;right:15px;box-shadow:0 0 10px #00000080}.element-dot.fire{background:#ff5252;box-shadow:0 0 15px #ff525299}.element-dot.water{background:#2196f3;box-shadow:0 0 15px #2196f399}.element-dot.ice{background:#00bcd4;box-shadow:0 0 15px #00bcd499}.cm-modal-overlay{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:10000;background:#000000e6;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.cm-modal{border:1px solid var(--cm-accent);width:900px;box-shadow:0 0 100px var(--cm-accent-glow);background:#141414f2;border-radius:20px;flex-direction:column;gap:30px;padding:40px;display:flex}.cm-modal-header{justify-content:space-between;align-items:center;display:flex}.cm-modal-header h2{letter-spacing:-1px;font-size:1.8rem;font-weight:900}.close-btn{color:#fff6;cursor:pointer;background:0 0;border:none;transition:all .3s}.close-btn:hover{color:#fff;transform:rotate(90deg)}.create-form{grid-template-columns:1fr 1fr;gap:40px;display:grid}.input-field{flex-direction:column;gap:10px;display:flex}.input-field label{color:var(--cm-accent);letter-spacing:2px;font-size:.7rem;font-weight:800}.input-field input,.input-field select{color:#fff;background:#ffffff1a;border:1px solid #ffffff1a;border-radius:8px;outline:none;padding:15px;font-size:1rem;transition:all .3s}.input-field input:focus,.input-field select:focus{border-color:var(--cm-accent);background:#ffffff26}.select-group{grid-template-columns:1fr 1fr;gap:20px;display:grid}.card-preview-section{flex-direction:column;grid-column:span 1;gap:20px;display:flex}.preview-label{text-align:center;color:#ffffff4d;font-size:.7rem}.preview-container{justify-content:center;display:flex}.submit-btn{grid-column:span 2;padding:20px;font-size:1.2rem;background:var(--cm-accent)!important;color:#000!important}@media (max-width:1024px){.cm-modal{width:95%;height:95%;overflow-y:auto}.create-form{grid-template-columns:1fr}.card-preview-section{order:2}}@media (max-width:768px){.cards-manager-container{padding:30px 20px}.cm-header{flex-direction:column;align-items:flex-start;gap:20px}.cm-title-group h1{font-size:2rem}}
