*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f3f3f3;color:#3d4652;font-size:14px}.top{height:68px;background:#2c3036;color:#fff;display:flex;align-items:center;padding:0 28px;justify-content:space-between}.logo{font-size:30px;font-weight:800;font-style:italic;color:#6ec5ee;letter-spacing:-4px}.topright{font-size:13px}.topright a{color:#ddd;text-decoration:none}.layout{display:flex;min-height:calc(100vh - 100px)}aside{width:210px;background:#f6f6f6;border-right:1px solid #ddd;flex:none}.search{padding:12px;border-bottom:1px solid #ddd;color:#888}nav a{display:block;padding:8px 12px;color:#333;text-decoration:none;font-size:13px}nav a:hover{background:#e8e8e8;color:#168fc0}.navgroup{font-weight:bold;padding:10px 10px 7px;border-top:1px solid #ddd;background:#e8e8e8;color:#333}main{flex:1;min-width:0}.crumb{padding:10px 14px;background:#eee;border-bottom:1px solid #ddd;color:#198ebc}.crumb a{color:#168fc0}.content{background:#fff;margin:10px 14px;padding:22px;min-height:calc(100vh - 150px)}h2{font-size:16px;border-bottom:1px solid #ddd;padding-bottom:15px}h3{color:#178eb7}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.cards{margin:18px 0 28px}.card{display:block;padding:22px 16px;border:1px solid #ddd;border-radius:6px;text-decoration:none;color:#3c4650;box-shadow:0 2px 4px #ddd;background:#fff}.card:hover{border-color:#67b7d4}.card b{display:block;font-size:17px;color:#2697ba;margin-bottom:8px}.card small{line-height:1.45}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0}.stats>div{background:#f7f7f7;border:1px solid #ddd;padding:15px;border-radius:5px}.stats strong{display:block;font-size:18px;color:#258fac;margin-bottom:4px}.stats span{color:#777;font-size:12px}.panel{border:1px solid #ddd;border-radius:5px;padding:18px;margin:18px 0;background:#fff}.formgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.formgrid label,.login-card label{font-weight:bold;font-size:12px;color:#666}.formgrid input,.formgrid select,.login-card input{display:block;width:100%;margin-top:6px;padding:10px;border:1px solid #ccc;border-radius:4px;background:#fff}.formgrid button{align-self:end}button{border:0;border-radius:4px;background:#299bc2;color:#fff;padding:11px 17px;cursor:pointer}button:hover{filter:brightness(.93)}table{width:100%;border-collapse:collapse}th,td{padding:10px;border-bottom:1px solid #e4e4e4;text-align:left;font-size:13px}th{background:#f4f4f4}.tablewrap{overflow:auto}.badge{padding:4px 8px;border-radius:10px;background:#ddd}.badge.online{background:#d8f2df;color:#19763a}.badge.offline{background:#eee}.badge.suspended{background:#fff0c9;color:#8b6500}.inline{display:flex;gap:5px}.inline select{padding:6px}.alert{padding:12px;background:#e8f5fb;border:1px solid #b9dfea;margin:12px 0;border-radius:4px}.alert.danger{background:#fff0f0;border-color:#efb5b5;color:#a22}pre{white-space:pre-wrap;overflow:auto;background:#1e2329;color:#d7e4ea;padding:14px;border-radius:5px}footer{text-align:center;padding:12px;color:#888;font-size:12px}.login-body{min-height:100vh;display:flex;align-items:center;justify-content:center;background:#2c3036}.login-card{width:380px;background:#fff;padding:30px;border-radius:8px;box-shadow:0 10px 40px rgba(0,0,0,.3)}.login-card.wide{width:520px}.login-card .brand{text-align:center;font-size:40px;font-weight:900;font-style:italic;color:#269bc1;letter-spacing:-5px}.login-card h1{text-align:center;font-size:22px}.login-card p{text-align:center;color:#888}.login-card label{display:block;margin:12px 0}.login-card button{width:100%;margin-top:10px}@media(max-width:900px){aside{width:170px}.grid{grid-template-columns:1fr 1fr}.formgrid{grid-template-columns:1fr 1fr}.stats{grid-template-columns:1fr 1fr}}@media(max-width:650px){.top{padding:0 14px}.topright{font-size:10px}aside{display:none}.content{margin:0;padding:14px}.grid,.formgrid,.stats{grid-template-columns:1fr}.login-card,.login-card.wide{width:calc(100% - 30px)}}

/* SonicPanel-style Radio List */
.sp-list-head{border:1px solid #ddd;background:#f5f5f5;border-radius:4px 4px 0 0;margin-bottom:16px}
.sp-list-title{padding:11px 14px;color:#59616b;font-size:14px}.sp-list-title span{margin-left:5px}
.sp-info{border-left:3px solid #2fb0c4;border-top:1px solid #eee;border-right:1px solid #eee;border-bottom:1px solid #eee;padding:18px 18px 14px;margin-bottom:12px;background:#fff}
.sp-info-line{color:#69737d;margin-bottom:12px}.sp-info-line span{margin-left:4px}.sp-total{font-size:13px;margin-bottom:18px;color:#68727d}.sp-total strong{font-weight:700}
.sp-search{display:flex;border:1px solid #d4d8dc;border-radius:4px;height:33px;overflow:hidden}.sp-search-icon{width:52px;display:flex;align-items:center;justify-content:center;background:#fafafa;color:#5b6873;font-size:22px;border-right:1px solid #eee}.sp-search input{border:0;outline:0;width:100%;padding:0 10px;color:#68727d}
.sp-toolbar{display:flex;align-items:center;gap:12px;padding:0 0 8px;color:#68727d}.sp-multiselect{display:flex;align-items:center;gap:4px;font-size:13px}.sp-toolbar select{height:30px;border:1px solid #d0d5d9;border-radius:3px;color:#707982;background:#fff;padding:0 25px 0 9px}.sp-action-btn{height:30px;padding:0 12px;background:#279bb2;font-size:12px;display:none}
.sp-table-wrap{width:100%;overflow-x:auto;border:1px solid #ddd;background:#fff}
.sp-radio-table{min-width:1180px;border-collapse:collapse;width:100%;font-size:12px}
.sp-radio-table thead th{background:#1ea1b4;color:#fff;border-right:1px solid rgba(255,255,255,.18);height:38px;padding:7px 8px;white-space:nowrap;font-weight:700;text-align:center}
.sp-radio-table tbody td{height:40px;padding:6px 8px;border-right:1px solid #eceff1;border-bottom:1px solid #e2e5e7;white-space:nowrap;text-align:center;color:#4e5964;background:#fff}
.sp-radio-table tbody tr:hover td{background:#f7fbfc}.sp-radio-table .check-col{width:35px;padding-left:5px;padding-right:5px}
.sp-radio-table input[type=checkbox]{width:15px;height:15px;vertical-align:middle}
.sp-radio-table .radio-user{text-decoration:none;color:#303942;font-weight:700}.sp-radio-table .radio-user:hover{color:#179bb5}
.status-online{font-weight:700}.status-online.is-online{color:#1b9b47}.status-online.is-offline{color:#9a9a9a}
.account-status{color:#313941}.sp-controls{display:flex;justify-content:center;gap:5px}.control-form{margin:0;padding:0}.ctrl{width:50px;height:27px;border-radius:4px;border:0;color:#fff;font-weight:bold;display:flex;align-items:center;justify-content:center;text-decoration:none;cursor:pointer;font-size:13px}
.ctrl.start{background:#1fa24b}.ctrl.stop{background:#9ea5ab}.ctrl.manage{background:#f2b900;color:#20252a}.ctrl:hover{filter:brightness(.92)}
.empty-row{padding:30px!important;color:#888!important}
.radio-detail .detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.detail-grid>div{border:1px solid #ddd;padding:12px;background:#fafafa}.detail-grid b{display:block;color:#69737d;font-size:11px;margin-bottom:5px}.detail-grid span{font-weight:600}.back-link{color:#1597b0;text-decoration:none}
@media(max-width:800px){.radio-detail .detail-grid{grid-template-columns:1fr 1fr}.sp-info{padding:14px 12px}}