:root{--steam-bg-dark: #171a21;--steam-bg-main: #1b2838;--steam-bg-content: #101822;--steam-bg-header: #171a21;--steam-bg-card: rgba(0, 0, 0, .2);--steam-text-light: #c6d4df;--steam-text-lighter: #e1e1e1;--steam-text-dark: #8f98a0;--steam-text-link: #66c0f4;--steam-text-link-hover: #ffffff;--steam-accent-blue: #66c0f4;--steam-accent-green: #a4d007;--steam-accent-red: #c9404d;--steam-border-color: #2a475e;--steam-gradient-header: linear-gradient(to bottom, #171a21 0%, #1b2838 100%);--steam-gradient-blue: linear-gradient( to bottom, rgba(102, 192, 244, .2) 5%, rgba(47, 137, 188, .2) 95%);--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif}*{box-sizing:border-box}body{margin:0;padding:0;font-family:var(--font-family);background-color:var(--steam-bg-main);background:radial-gradient(circle at 50% 0%,#2a475e,#1b2838 40%,#171a21);background-attachment:fixed;color:var(--steam-text-light);-webkit-font-smoothing:antialiased;min-height:100vh}a{color:var(--steam-text-link);text-decoration:none;transition:color .2s}a:hover{color:var(--steam-text-link-hover)}h1,h2,h3,h4,h5,h6{color:#fff;font-weight:300;margin-bottom:1rem}button{font-family:var(--font-family)}::-webkit-scrollbar{width:12px;background:#171a21}::-webkit-scrollbar-thumb{background:#3d4450;border-radius:6px}::-webkit-scrollbar-thumb:hover{background:#4f5866}.app{display:flex;flex-direction:column;min-height:100vh}.main{flex:1;width:100%;max-width:1400px;margin:0 auto;padding:2rem 1rem}.header{background:#171a21;padding:0;box-shadow:0 0 20px #00000080;position:sticky;top:0;z-index:100;border-bottom:1px solid #000}.header-content{width:100%;height:104px;display:flex;align-items:center;justify-content:space-between;padding:0 2rem}.logo{font-size:28px;font-weight:300;color:#e1e1e1;text-transform:uppercase;letter-spacing:2px;text-shadow:0 2px 4px rgba(0,0,0,.5)}.nav{display:flex;gap:0;height:100%;align-items:center}.nav a{color:#b8b6b4;font-size:14px;font-weight:700;text-transform:uppercase;padding:0 1.5rem;height:100%;display:flex;align-items:center;border-bottom:3px solid transparent;transition:all .2s}.nav a:hover{color:#fff;background:transparent;border-bottom-color:#ffffff4d}.nav a.active{color:#fff;background:transparent;border-bottom:3px solid var(--steam-accent-blue)}.auth{display:flex;align-items:center}.user-info{display:flex;align-items:center;gap:1rem;background:#0003;padding:.5rem 1rem;border-radius:2px}.avatar{width:34px;height:34px;border-radius:2px;border:1px solid var(--steam-text-dark)}.username{color:var(--steam-text-link);font-weight:700}.admin-badge{background:var(--steam-accent-red);color:#fff;font-size:10px;padding:2px 6px;border-radius:2px;text-transform:uppercase}.btn{display:inline-block;padding:.5rem 1rem;border-radius:2px;border:none;cursor:pointer;font-size:14px;font-weight:500;text-align:center;transition:all .2s;color:#fff;background:linear-gradient(to bottom,#41778f 5%,#3d697b 95%);box-shadow:0 1px 4px #0000004d;text-shadow:0 1px 1px rgba(0,0,0,.2)}.btn:hover{background:linear-gradient(to bottom,#66c0f4 5%,#306786 95%);color:#fff;box-shadow:0 2px 8px #0006}.btn-primary{background:linear-gradient(to bottom,#a4d007 5%,#536904 95%)}.btn-primary:hover{background:linear-gradient(to bottom,#b6d908 5%,#80a006 95%)}.btn-danger{background:linear-gradient(to bottom,#c9404d 5%,#8a1c26 95%)}.btn-sm{padding:.25rem .5rem;font-size:12px}.table-container{background:#0003;border:1px solid rgba(0,0,0,.4);margin-top:1rem;box-shadow:0 0 10px #0003;overflow-x:auto;width:100%}.table-container::-webkit-scrollbar{height:10px;background:#171a21}.table-container::-webkit-scrollbar-thumb{background:#3d4450;border-radius:5px;border:1px solid #171a21}.table-container::-webkit-scrollbar-thumb:hover{background:#66c0f4}.table-container::-webkit-scrollbar-track{background:#171a21}table{width:100%;border-collapse:collapse;font-size:14px;min-width:800px}th{background:linear-gradient(to bottom,#2a3f5a,#1b2838);color:#9099a1;font-weight:400;text-align:left;padding:12px 14px;text-transform:uppercase;font-size:12px;letter-spacing:1px;border-bottom:1px solid #000;white-space:nowrap}td{padding:10px 14px;border-top:1px solid rgba(0,0,0,.2);color:#c6d4df;vertical-align:middle;white-space:nowrap}.reason-cell{max-width:250px;overflow:hidden;text-overflow:ellipsis}tr:nth-child(odd){background:#0000001a}tr:hover{background:#ffffff0d}.card{background:#0003;padding:1.5rem;margin-bottom:1.5rem;border:1px solid rgba(0,0,0,.4)}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;border-bottom:1px solid var(--steam-border-color);padding-bottom:1rem}.page-title{font-size:26px;color:#fff;text-transform:uppercase;letter-spacing:1px;font-weight:300;text-shadow:0 0 10px rgba(0,0,0,.5)}input,select,textarea{background:#0003;border:1px solid #000;color:var(--steam-text-light);padding:8px;border-radius:2px;width:100%;font-family:inherit}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--steam-text-link);background:#1a1a1a}label{display:block;color:var(--steam-text-link);margin-bottom:.5rem;font-size:14px;text-transform:uppercase}.modal-overlay{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:#1b2838;border:1px solid #2a475e;padding:2rem;width:100%;max-width:500px;box-shadow:0 0 20px #00000080}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;border-bottom:1px solid #2a475e;padding-bottom:1rem}.modal-title{color:var(--steam-text-link);font-size:22px;text-transform:uppercase}.close-btn{background:none;border:none;color:var(--steam-text-dark);font-size:24px;cursor:pointer}.close-btn:hover{color:#fff}.status-active{color:var(--steam-accent-green);font-weight:700;text-shadow:0 0 5px rgba(164,208,7,.2)}.status-expired{color:var(--steam-text-dark)}.status-permanent{color:var(--steam-accent-red);font-weight:700}.btn-secondary{background:linear-gradient(to bottom,#3d4450 5%,#2a2e35 95%);color:#fff;border:1px solid rgba(0,0,0,.2)}.btn-secondary:hover{background:linear-gradient(to bottom,#4f5866 5%,#3d4450 95%);color:#fff}.pagination{display:flex;justify-content:center;align-items:center;gap:1rem;margin-top:1rem;color:var(--steam-text-dark)}.pagination span{color:var(--steam-text-light)}.form-group{margin-bottom:1rem}.form-actions{display:flex;justify-content:flex-end;gap:1rem;margin-top:2rem}.filters{display:flex;align-items:center;gap:1.5rem;background:#0003;padding:.5rem 1rem;border-radius:2px;border:1px solid rgba(255,255,255,.1);flex-wrap:wrap}.search-form{display:flex;gap:.5rem}.search-input{width:220px;padding:.4rem .5rem;font-size:13px}.reason-cell{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filters label{display:flex;align-items:center;gap:.5rem;margin:0;color:var(--steam-text-light);text-transform:uppercase;font-size:12px;font-weight:700;cursor:pointer}.filters label:hover{color:#fff}.filters input[type=checkbox]{width:auto;accent-color:var(--steam-accent-blue)}.server-card{background:#0003;padding:1.5rem;margin-bottom:1.5rem;border:1px solid rgba(0,0,0,.4)}.server-card h3{color:var(--steam-text-link);margin-top:0;font-size:18px;text-transform:uppercase}.server-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:1rem;color:var(--steam-text-light)}.server-info span{color:var(--steam-text-dark);font-weight:700;margin-right:.5rem}.api-key{background:#0000004d;padding:1rem;margin:1rem 0;border:1px solid var(--steam-border-color);font-family:monospace;word-break:break-all;color:var(--steam-accent-green)}.server-actions{display:flex;gap:.5rem;margin-top:1rem;border-top:1px solid rgba(0,0,0,.2);padding-top:1rem}.back-link{display:inline-block;margin-bottom:1rem;color:var(--steam-text-link)}.back-link:hover{color:var(--steam-text-link-hover)}.detail-page{background:#0003;padding:2rem;border:1px solid rgba(0,0,0,.4)}.detail-page h2{color:#fff;margin-top:0;margin-bottom:2rem;border-bottom:1px solid var(--steam-border-color);padding-bottom:1rem;text-transform:uppercase;letter-spacing:1px}.detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}.detail-item label{display:block;color:var(--steam-text-dark);margin-bottom:.5rem;font-size:12px;text-transform:uppercase;letter-spacing:1px}.detail-item .value{color:var(--steam-text-light);font-size:16px;background:#0003;padding:.5rem;border:1px solid rgba(0,0,0,.2)}.detail-actions{margin-top:2rem;padding-top:2rem;border-top:1px solid var(--steam-border-color)}.penalty-detail{max-width:900px;margin:0 auto}.penalty-header{background:linear-gradient(to bottom,#0006,#0003);border:1px solid rgba(0,0,0,.4);border-left:4px solid #c9404d;margin-bottom:0}.penalty-header-content{display:flex;align-items:center;gap:1.5rem;padding:1.5rem}.penalty-avatar{width:80px;height:80px;background:#0000004d;border:2px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;flex-shrink:0}.penalty-avatar svg{width:48px;height:48px;color:var(--steam-text-dark)}.penalty-header-info{flex:1;min-width:0}.penalty-header-info h1{margin:0 0 .5rem;font-size:24px;font-weight:500;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.penalty-meta{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.penalty-type{background:#0006;color:var(--steam-text-dark);font-size:11px;font-weight:700;padding:4px 8px;letter-spacing:1px}.penalty-status{font-size:12px;font-weight:700;padding:4px 10px;text-transform:uppercase;letter-spacing:.5px}.penalty-permanent{background:#c9404d33;color:#c9404d;font-size:11px;font-weight:700;padding:4px 8px;text-transform:uppercase}.penalty-body{background:#0003;border:1px solid rgba(0,0,0,.4);border-top:none;padding:1.5rem}.penalty-section{margin-bottom:2rem}.penalty-section:last-child{margin-bottom:0}.penalty-section h2{color:var(--steam-text-link);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin:0 0 1rem;padding-bottom:.5rem;border-bottom:1px solid rgba(255,255,255,.1)}.penalty-reason{background:#0000004d;padding:1rem;color:var(--steam-text-light);font-size:15px;line-height:1.5;border-left:3px solid var(--steam-border-color)}.penalty-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}.penalty-info-item{background:#0003;padding:.75rem 1rem}.penalty-info-label{display:block;color:var(--steam-text-dark);font-size:11px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.25rem}.penalty-info-value{display:block;color:var(--steam-text-light);font-size:14px}.penalty-info-value.mono{font-family:monospace}.penalty-attempts{background:#0003;max-height:300px;overflow-y:auto}.penalty-attempt{display:flex;align-items:center;gap:1.5rem;padding:.75rem 1rem;border-bottom:1px solid rgba(0,0,0,.2)}.penalty-attempt:last-child{border-bottom:none}.penalty-attempt:nth-child(odd){background:#0000001a}.attempt-time{color:var(--steam-text-dark);font-size:12px;flex-shrink:0;width:160px}.attempt-name{color:var(--steam-text-light);font-size:13px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.attempt-ip{color:var(--steam-text-dark);font-size:12px;font-family:monospace;flex-shrink:0}.penalty-actions{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.1)}@media(max-width:600px){.penalty-header-content{flex-direction:column;text-align:center}.penalty-meta{justify-content:center}.penalty-info-grid{grid-template-columns:1fr}.penalty-attempt{flex-direction:column;align-items:flex-start;gap:.25rem}.attempt-time{width:auto}}.steamid-display{font-size:12px}.steamid-row{display:flex;gap:.5rem}.steamid-label{color:var(--steam-text-dark);width:70px}.steamid-value{color:var(--steam-text-light);font-family:monospace}html{overflow-y:scroll}.hamburger{display:none;background:none;border:none;cursor:pointer;padding:.5rem;margin-left:auto}.hamburger span{display:block;width:24px;height:2px;background:var(--steam-text-light);margin:5px 0;transition:all .3s}.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.hamburger.open span:nth-child(2){opacity:0}.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}@media(max-width:768px){.header-content{height:auto;min-height:60px;flex-wrap:wrap;padding:.75rem 1rem;gap:.5rem}.logo{font-size:20px;letter-spacing:1px}.hamburger{display:flex;flex-direction:column;justify-content:center;order:1}.header>.header-content>div:first-child{width:100%;justify-content:space-between}.nav{display:none;width:100%;order:3;flex-direction:column;background:#0000004d;margin-top:.5rem}.nav.open{display:flex}.nav a{padding:1rem 1.5rem;border-bottom:1px solid rgba(255,255,255,.1);height:auto}.nav a:last-child{border-bottom:none}.auth{order:2}.user-info{padding:.25rem .5rem;gap:.5rem}.username{display:none}.avatar{width:28px;height:28px}.admin-badge{font-size:9px;padding:2px 4px}.user-info .btn{padding:.25rem .5rem;font-size:11px;margin-left:.5rem!important}.main{padding:1rem .75rem}.page-header{flex-direction:column;align-items:flex-start;gap:1rem}.page-title{font-size:20px}.filters{flex-direction:column;width:100%;gap:.75rem;padding:.75rem}.search-form{width:100%;flex-direction:column;gap:.5rem}.search-input,.filters .btn{width:100%}.filters label{width:100%;justify-content:flex-start}.table-container{margin-left:-.75rem;margin-right:-.75rem;width:calc(100% + 1.5rem);border-left:none;border-right:none}th,td{padding:8px 10px;font-size:13px}.reason-cell{max-width:120px}.card{padding:1rem;margin-bottom:1rem}.server-card{padding:1rem}.server-card h3{font-size:16px}.server-actions{flex-wrap:wrap}.server-actions .btn{flex:1;min-width:calc(50% - .25rem)}.modal{max-width:calc(100% - 2rem);margin:1rem;padding:1.5rem}.modal-title{font-size:18px}.form-actions{flex-direction:column;gap:.5rem}.form-actions .btn{width:100%}.pagination{flex-wrap:wrap;gap:.5rem}}@media(max-width:480px){.main{padding:.75rem .5rem}.page-title{font-size:18px}.detail-grid{grid-template-columns:1fr;gap:1rem}.detail-page{padding:1rem}.detail-page h2{font-size:18px;margin-bottom:1rem}.detail-item .value{font-size:14px}.steamid-display{font-size:11px}.steamid-label{width:60px}.back-link{font-size:14px}th,td{padding:6px 8px;font-size:12px}.reason-cell{max-width:100px}}