:root{--bg-color:#292a2d;--primary-gradient-start:#65a6bc;--primary-gradient-end:#87cfde;--text-color:#ffffff;--secondary-color:#4a4b4f;--danger-color:#e74c3c;--success-color:#2ecc71;--warning-color:#f39c12;--border-radius:8px;--box-shadow:0 4px 6px rgba(0, 0, 0, 0.1)}*{margin:0;padding:0;box-sizing:border-box}main{min-height:calc(100vh - 240px)}body{font-family:Arial,sans-serif;background-color:var(--bg-color);color:var(--text-color);line-height:1.6;padding-top:20px}.container{max-width:1000px;margin:0 auto;padding:0 20px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.title-logo{height:70px;width:auto}h1{font-size:2rem;background:linear-gradient(to right,var(--primary-gradient-start),var(--primary-gradient-end));-webkit-background-clip:text;background-clip:text;color:transparent;display:flex;justify-content:center}.user-id-container{cursor:pointer;font-size:1.5rem;color:var(--primary-gradient-end)}.tabs{display:flex;border-bottom:1px solid var(--secondary-color);margin-bottom:20px}.tab{padding:10px 20px;cursor:pointer;position:relative}.tab.active{color:var(--primary-gradient-end)}.tab.active::after{content:'';position:absolute;bottom:-1px;left:0;width:100%;height:2px;background:linear-gradient(to right,var(--primary-gradient-start),var(--primary-gradient-end))}.tab-content{padding:20px 0}.tab-pane{display:none}.tab-pane.active{display:block}.form-group{margin-bottom:20px}label{display:block;margin-bottom:8px;font-weight:700}input[type=text]{width:100%;padding:10px;border:1px solid var(--secondary-color);border-radius:var(--border-radius);background-color:rgba(255,255,255,.1);color:var(--text-color);font-size:1rem}input[type=text]:focus{outline:0;border-color:var(--primary-gradient-start)}.btn{padding:10px 20px;border:none;border-radius:var(--border-radius);background:linear-gradient(to right,var(--primary-gradient-start),var(--primary-gradient-end));color:var(--text-color);font-size:1rem;cursor:pointer;transition:all .3s ease}.btn:hover{opacity:.9;transform:translateY(-2px)}.btn.danger{background:var(--danger-color)}.avatar-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:10px}.avatar-item{display:flex;justify-content:center;align-items:center;height:60px;background-color:rgba(255,255,255,.1);border-radius:var(--border-radius);cursor:pointer;transition:all .3s ease}.avatar-item:hover{background-color:rgba(255,255,255,.2)}.avatar-item.selected{background:linear-gradient(to right,var(--primary-gradient-start),var(--primary-gradient-end))}.avatar-item i{font-size:1.5rem}.game-mode-selector{display:flex;gap:10px;margin-top:10px}.game-mode{flex:1;padding:10px;text-align:center;background-color:rgba(255,255,255,.1);border-radius:var(--border-radius);cursor:pointer;transition:all .3s ease}.game-mode:hover{background-color:rgba(255,255,255,.2)}.game-mode.active{background:linear-gradient(to right,var(--primary-gradient-start),var(--primary-gradient-end))}.setting-group{margin-top:15px;padding:15px;background-color:rgba(255,255,255,.05);border-radius:var(--border-radius)}.setting-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.setting-row:last-child{margin-bottom:0}.slider-container{flex:1;margin-left:20px}.slider{-webkit-appearance:none;appearance:none;width:100%;height:5px;border-radius:5px;background:var(--secondary-color);outline:0}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--primary-gradient-end);cursor:pointer}.slider-value{margin-left:10px;min-width:30px;text-align:center}.number-input{display:flex;align-items:center}.number-btn{width:30px;height:30px;display:flex;justify-content:center;align-items:center;background-color:var(--secondary-color);border:none;border-radius:50%;color:var(--text-color);cursor:pointer}.number-value{margin:0 10px;min-width:30px;text-align:center}.switch{position:relative;display:inline-block;width:60px;height:34px}.switch input{opacity:0;width:0;height:0}.slider-switch{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:var(--secondary-color);transition:.4s;border-radius:34px}.slider-switch:before{position:absolute;content:"";height:26px;width:26px;left:4px;bottom:4px;background-color:#fff;transition:.4s;border-radius:50%}input:checked+.slider-switch{background:linear-gradient(to right,var(--primary-gradient-start),var(--primary-gradient-end))}input:checked+.slider-switch:before{transform:translateX(26px)}.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,.7);pointer-events:auto}.modal-content{background-color:var(--bg-color);margin:0;padding:20px;border:1px solid var(--secondary-color);border-radius:var(--border-radius);width:80%;max-width:500px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.close{position:absolute;right:20px;top:10px;font-size:28px;font-weight:700;cursor:pointer}.modal-buttons{display:flex;justify-content:flex-end;margin-top:20px;width:100%}#reset-user-id{background:var(--danger-color);margin-left:auto;float:right}.notification{position:fixed;top:30px;left:50%;transform:translateX(-50%);padding:10px 20px;background-color:rgba(0,0,0,.8);color:#fff;border-radius:var(--border-radius);z-index:1001;display:none}.hidden{display:none!important}@media (max-width:768px){.avatar-grid{grid-template-columns:repeat(3,1fr)}.game-mode-selector{flex-direction:column}}.avatar-selector{position:relative;display:inline-block;cursor:pointer}.avatar-preview{width:60px;height:60px;background-color:rgba(255,255,255,.1);border-radius:var(--border-radius);display:flex;justify-content:center;align-items:center;font-size:1.5rem}.avatar-popup{position:absolute;top:100%;left:0;margin-top:10px;background-color:var(--bg-color);border:1px solid var(--secondary-color);border-radius:var(--border-radius);padding:10px;z-index:1000;display:none}.avatar-popup.show{display:block}.avatar-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;width:300px}.game-mode-select{width:100%;padding:10px;border:1px solid var(--secondary-color);border-radius:var(--border-radius);background-color:rgba(255,255,255,.1);color:var(--text-color);font-size:1rem;cursor:pointer;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 10px center;background-size:1em}.game-mode-select:focus{outline:0;border-color:var(--primary-gradient-start)}.game-mode-select option{background-color:var(--bg-color);color:var(--text-color)}.custom-cards-container{display:flex;flex-direction:column;gap:10px;margin-top:10px;max-height:300px;overflow-y:auto}.custom-card-row{display:flex;align-items:center;gap:10px}.custom-card-name{flex:1}.delete-card-btn{background:0 0;border:none;color:var(--danger-color);cursor:pointer;font-size:1.2rem;display:flex;align-items:center;justify-content:center;padding:5px}.add-card-btn{margin-top:10px;width:auto;background:rgba(255,255,255,.1);color:#999;padding:5px 15px;border-radius:var(--border-radius);transition:all .3s ease}.add-card-btn:hover{background:rgba(255,255,255,.2);transform:none}.card-count-info{padding:10px;border-radius:var(--border-radius);background-color:rgba(255,255,255,.1);text-align:center}.card-count-info.error{background-color:rgba(231,76,60,.3);color:#ff6b6b}.btn.disabled{opacity:.5;cursor:not-allowed;pointer-events:none}footer{margin-top:20px;padding:20px 0 10px 0;border-top:1px solid var(--secondary-color)}.footer-content{display:flex;justify-content:space-between;align-items:center;margin-bottom:0}.footer-logo{display:flex;align-items:center}.logo-img{height:40px;width:auto}.social-links{display:flex;gap:15px}.social-links a{color:var(--text-color);font-size:1.5rem;transition:color .3s}.social-links a:hover{color:var(--primary-gradient-end)}.copyright{text-align:center;font-size:.8rem;color:#999;padding-bottom:0;margin-bottom:0}.email-tooltip{position:fixed;top:80%;left:50%;transform:translate(-50%,-50%);background-color:var(--bg-color);border:1px solid var(--secondary-color);border-radius:var(--border-radius);padding:10px;box-shadow:var(--box-shadow);z-index:1000;display:none}.email-tooltip.show{display:block}.email-content{display:flex;align-items:center;gap:10px}.email-address{font-size:.9rem}.copy-btn{padding:5px 10px;background:linear-gradient(to right,var(--primary-gradient-start),var(--primary-gradient-end));border:none;border-radius:var(--border-radius);color:#fff;cursor:pointer;font-size:.8rem}.copy-btn:hover{opacity:.9}@media (max-width:768px){.footer-content{flex-direction:row;justify-content:space-between;align-items:center}}