.tabs{display:flex;flex-wrap:wrap;gap:10px;overflow:visible;padding:10px;border:1px solid #343a43;background:linear-gradient(145deg,#15191ff2,#090c11f7);box-shadow:inset 0 1px #ffffff14,0 16px 42px #0009}
.tabs button{position:relative;overflow:hidden;flex:0 0 calc((100% - 20px)/3);min-height:58px;padding:11px 10px;white-space:normal;line-height:1.25;border:1px solid #363c45;border-radius:15px;background:linear-gradient(145deg,#1b2027,#0d1015);color:#a3aab4;box-shadow:inset 0 1px #ffffff12,0 7px 18px #0006;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease}
.tabs button:before{content:'';position:absolute;inset:0;background:linear-gradient(125deg,#ffffff0c,transparent 38%,transparent 72%,#ffd00008);pointer-events:none}
.tabs button:active{transform:scale(.98)}
.tabs button.active{border-color:#9a7f00;color:#ffe044;background:radial-gradient(circle at 28% 0,#4a3b0f,#17160e 70%);box-shadow:inset 0 1px #ffe66b50,0 8px 24px #0008,0 0 18px #ffd0001d}
.tabs button.active:after{content:'';position:absolute;left:22%;right:22%;bottom:0;height:2px;border-radius:4px;background:#ffd000;box-shadow:0 0 10px #ffd000}
.tabs button:nth-child(4),.tabs button:nth-child(5){flex-basis:calc((100% - 10px)/2)}
@media(max-width:600px){.tabs{gap:7px;padding:7px;border-radius:18px}.tabs button{flex-basis:calc((100% - 14px)/3);min-height:56px;padding:8px 5px;font-size:9px;border-radius:12px}.tabs button:nth-child(4),.tabs button:nth-child(5){flex-basis:calc((100% - 7px)/2);font-size:10px}}