.settings-app{width:min(100%,620px);min-height:100vh;margin:auto;padding:24px 20px 50px}.settings-top{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:12px;margin-bottom:22px}.settings-top>a{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#181818;color:#fff;text-decoration:none;font-size:32px}.settings-top small{font:800 10px system-ui;letter-spacing:1.5px;color:var(--blue)}.settings-top h1{font-size:25px;margin:3px 0 0}.settings-top>button{border:0;background:transparent;color:#777;font-weight:700;cursor:pointer}.settings-hero{display:flex;align-items:center;gap:16px;padding:20px;border:1px solid #333;border-radius:20px;background:linear-gradient(125deg,#181b31,#121212);margin-bottom:24px}.settings-hero>span{display:grid;place-items:center;width:55px;height:55px;border-radius:17px;background:var(--blue);font-size:27px}.settings-hero b{font-size:17px}.settings-hero p{margin:5px 0 0;color:#8d8d8d;font-size:12px;line-height:1.7}.settings-group{margin-bottom:22px}.settings-group h2{margin:0 0 10px 4px;color:#777;font-size:12px;text-transform:uppercase;letter-spacing:1.2px}.setting-row,.select-row,.input-row,.color-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px;background:#151515;border:1px solid #292929}.settings-group>:nth-child(2){border-radius:17px 17px 0 0}.settings-group>:last-child{border-radius:0 0 17px 17px}.settings-group>:only-child{border-radius:17px}.setting-row b,.select-row b,.input-row b,.color-row b{display:block;font-size:14px}.setting-row small,.select-row small,.input-row small,.color-row small{display:block;margin-top:4px;color:#777;font-size:10px;line-height:1.5}.setting-row input{display:none}.setting-row i{position:relative;flex:none;width:48px;height:27px;border-radius:20px;background:#343434;transition:.2s}.setting-row i:after{content:"";position:absolute;width:21px;height:21px;left:3px;top:3px;border-radius:50%;background:#aaa;transition:.2s}.setting-row input:checked+i{background:var(--blue)}.setting-row input:checked+i:after{transform:translateX(21px);background:#fff}.select-row select{border:1px solid #333;border-radius:10px;background:#222;color:#fff;padding:9px}.input-row{display:block}.input-row input{width:100%;margin-top:12px;border:1px solid #333;border-radius:11px;background:#0d0d0d;color:#fff;padding:12px;outline:none}.input-row input:focus{border-color:var(--blue)}.colors{display:flex;gap:9px}.colors button{width:28px;height:28px;border:3px solid transparent;border-radius:50%;background:var(--c);cursor:pointer}.colors button.active{border-color:#fff;box-shadow:0 0 0 3px var(--c)}.save-button{position:sticky;bottom:15px;width:100%;border:0;border-radius:15px;background:var(--blue);color:#fff;padding:15px;font-weight:800;box-shadow:0 8px 30px #000;cursor:pointer}.saved{position:fixed;left:50%;bottom:25px;transform:translate(-50%,20px);padding:11px 18px;border-radius:25px;background:#fff;color:#111;font-weight:700;opacity:0;pointer-events:none;transition:.25s}.saved.show{opacity:1;transform:translate(-50%,0)}@media(min-width:740px){body{background:#0d0d0d}.settings-app{box-shadow:0 0 60px #000}}