body{min-height:100vh;background:radial-gradient(circle at top right,#15213a 0,#0b1020 35%,#070a12 100%);background-attachment:fixed}.card{border-color:rgba(255,255,255,.1);box-shadow:0 10px 35px rgba(0,0,0,.18)}.navbar{backdrop-filter:blur(16px);background-color:rgba(20,25,40,.82)!important}.table>tbody>tr:hover>*{background-color:rgba(255,255,255,.025)}pre{white-space:pre-wrap;word-break:break-all}
:root{--panel:rgba(16,24,40,.78);--panel-2:rgba(23,33,54,.88);--line:rgba(255,255,255,.09);--muted:#98a2b8;--purple:#7c6cff;--cyan:#39c6f4;--green:#30d889;--orange:#ffb84d}body{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:#eef2ff}.app-main{max-width:1800px}.app-navbar{position:sticky;top:0;z-index:1020;background:rgba(7,10,18,.82)!important;backdrop-filter:blur(22px)}.navbar-brand{display:flex;align-items:center;gap:.65rem;font-weight:750;letter-spacing:-.02em}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,var(--purple),#aa64ff);box-shadow:0 8px 24px rgba(124,108,255,.32)}.navbar-nav{gap:.25rem}.navbar-nav .nav-link{display:flex;align-items:center;gap:.5rem;border-radius:10px;padding:.55rem .8rem;color:#aeb7ca}.navbar-nav .nav-link:hover,.navbar-nav .nav-link.active{color:#fff;background:rgba(124,108,255,.13)}.navbar-user{display:flex;align-items:center;gap:.7rem;padding:.35rem .45rem .35rem .35rem;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.025)}.navbar-user .avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:rgba(57,198,244,.14);color:#7bddff;font-weight:800}.navbar-user div{display:flex;flex-direction:column;line-height:1.1}.navbar-user small{margin-top:.25rem;text-transform:capitalize;color:var(--muted)}.logout-link{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;color:#aeb7ca}.logout-link:hover{background:rgba(255,255,255,.06);color:#fff}.dashboard-hero{display:flex;justify-content:space-between;align-items:end;gap:1rem;padding:1.35rem 1.5rem;border:1px solid var(--line);border-radius:20px;background:radial-gradient(circle at 85% 15%,rgba(124,108,255,.22),transparent 32%),linear-gradient(135deg,rgba(17,26,47,.93),rgba(10,15,29,.88));overflow:hidden}.dashboard-hero h1{font-weight:800;letter-spacing:-.04em}.eyebrow{display:inline-flex;align-items:center;gap:.45rem;margin-bottom:.55rem;color:#9c91ff;font-size:.77rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em}.btn-soft{border:1px solid var(--line);background:rgba(255,255,255,.035);color:#dbe2f4}.btn-soft:hover{border-color:rgba(124,108,255,.5);background:rgba(124,108,255,.12);color:#fff}.metric-card{position:relative;padding:1.15rem;border:1px solid var(--line);border-radius:17px;background:linear-gradient(145deg,var(--panel-2),var(--panel));overflow:hidden;transition:.2s ease}.metric-card:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.17)}.metric-card:after{content:"";position:absolute;width:100px;height:100px;border-radius:50%;right:-44px;top:-50px;background:var(--accent);opacity:.1}.metric-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent);font-size:1.1rem}.metric-value{margin-top:.8rem;font-size:1.8rem;font-weight:800;letter-spacing:-.04em}.metric-label{font-weight:650}.metric-sub{margin-top:.3rem;color:var(--muted);font-size:.76rem}.tone-primary{--accent:var(--purple)}.tone-info{--accent:var(--cyan)}.tone-success{--accent:var(--green)}.tone-warning{--accent:var(--orange)}.tone-purple{--accent:#bd72ff}.dashboard-card{border-color:var(--line);border-radius:18px;background:linear-gradient(145deg,rgba(20,29,48,.88),rgba(11,17,31,.88));overflow:hidden}.dashboard-card-header{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.15rem;border-bottom:1px solid var(--line);background:transparent}.dashboard-card-header h5{font-weight:750}.dashboard-card-header span{color:var(--muted);font-size:.78rem}.live-pill{display:inline-flex!important;align-items:center;gap:.4rem;padding:.3rem .55rem;border:1px solid rgba(48,216,137,.22);border-radius:999px;color:#77eeb5!important;background:rgba(48,216,137,.08)}.live-pill i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(48,216,137,.12)}.chart-wrap{height:360px}.dashboard-card>.card-body canvas{max-height:285px}.donut-wrap{position:relative;height:230px}.donut-center{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;pointer-events:none}.donut-center strong{font-size:1.8rem}.donut-center span{color:var(--muted);font-size:.78rem}.mini-stat{padding:.75rem .4rem;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.025)}.mini-stat strong,.mini-stat span{display:block}.mini-stat span{margin-top:.15rem;color:var(--muted);font-size:.72rem}.dashboard-table thead th{padding:.8rem 1rem;border-bottom-color:var(--line);color:#7f8ba3;font-size:.72rem;text-transform:uppercase;letter-spacing:.07em}.dashboard-table td{padding:.85rem 1rem;border-bottom-color:rgba(255,255,255,.055)}.table-title{color:#edf1ff;font-weight:700;text-decoration:none}.table-title:hover{color:#a99fff}.server-badge,.status-dot{display:inline-flex;align-items:center;gap:.4rem}.server-badge{padding:.32rem .55rem;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.025);font-size:.78rem}.status-dot{font-size:.78rem}.status-dot i{width:7px;height:7px;border-radius:50%}.status-dot.active{color:#65e5a6}.status-dot.active i{background:var(--green)}.status-dot.inactive{color:#ffc970}.status-dot.inactive i{background:var(--orange)}.detail-row{display:flex;align-items:center;gap:.8rem;padding:.72rem 0;border-bottom:1px solid rgba(255,255,255,.06)}.detail-row:last-child{border:0}.detail-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:rgba(124,108,255,.1);color:#9c91ff}.detail-row>div:last-child{display:flex;justify-content:space-between;align-items:center;flex-grow:1}.detail-row span{color:var(--muted);font-size:.84rem}.detail-row strong{font-size:1.05rem}.rank-row,.activity-row{display:flex;align-items:center;gap:.75rem;padding:.85rem 1rem;border-bottom:1px solid rgba(255,255,255,.06);color:#e9edfb;text-decoration:none;transition:.15s}.rank-row:hover,.activity-row:hover{background:rgba(124,108,255,.06)}.rank-row:last-child,.activity-row:last-child{border-bottom:0}.rank-number{color:#6f7b91;font-size:.75rem;font-weight:800}.rank-row strong,.activity-row strong,.rank-row small,.activity-row small{display:block}.rank-row small,.activity-row small{margin-top:.18rem;color:var(--muted);font-size:.74rem}.rank-links,.count-badge{padding:.28rem .45rem;border-radius:8px;background:rgba(48,216,137,.08);color:#6be7ab;font-size:.7rem;font-weight:700}.activity-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:rgba(57,198,244,.1);color:#69d8fb}.timeline{position:relative}.timeline-item{position:relative;display:flex;gap:.8rem;padding:0 0 1rem 1.15rem;border-left:1px solid rgba(255,255,255,.1)}.timeline-item:last-child{padding-bottom:0}.timeline-dot{position:absolute;left:-5px;top:5px;width:9px;height:9px;border-radius:50%;background:var(--purple);box-shadow:0 0 0 4px rgba(124,108,255,.12)}.timeline-item p{margin:.18rem 0;color:var(--muted);font-size:.76rem}.timeline-item small{color:#657188;font-size:.7rem}.empty-state{padding:2rem!important;text-align:center;color:var(--muted)}@media(max-width:991.98px){.navbar-user{margin-top:.75rem}.dashboard-hero{align-items:flex-start;flex-direction:column}.chart-wrap{height:300px}}@media(max-width:575.98px){.app-main{padding-left:12px!important;padding-right:12px!important}.dashboard-hero{padding:1rem}.dashboard-hero h1{font-size:1.65rem}.metric-card{padding:.9rem}.metric-value{font-size:1.45rem}.dashboard-card-header{align-items:flex-start;flex-direction:column}.dashboard-table{min-width:720px}}

/* v2.0 operations modules */
.sticky-save{position:sticky;bottom:1rem;z-index:20;display:flex;justify-content:flex-end;margin-top:1rem;padding:.75rem;border-radius:1rem;background:rgba(10,15,28,.82);backdrop-filter:blur(12px)}
.dropdown-menu .nav-link{border-radius:.5rem;margin:.15rem .35rem;white-space:nowrap}
.dropdown-menu .nav-link.active{background:rgba(99,102,241,.2)}
@media (max-width:1199.98px){.offcanvas .navbar-nav{gap:.25rem}.offcanvas .nav-link{padding:.8rem 1rem}.offcanvas .dropdown-menu{position:static!important;transform:none!important;border:0;background:rgba(255,255,255,.03);margin:.25rem 0}.navbar-user{padding:1rem;border-top:1px solid rgba(255,255,255,.08)}}
@media (max-width:575.98px){.dashboard-hero{align-items:stretch!important}.dashboard-hero>div:last-child,.dashboard-hero form{width:100%}.dashboard-hero .btn{flex:1}.dashboard-table{min-width:760px}.app-main{padding-left:.75rem!important;padding-right:.75rem!important}.card-body{padding:1rem}.sticky-save{bottom:.5rem}.sticky-save .btn{width:100%}}

/* v2.2 stream tools */
.stream-tool-tabs{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line);background:rgba(255,255,255,.02)}
.stream-tool-tab{display:flex;align-items:center;justify-content:center;min-height:58px;padding:.8rem 1rem;color:#9ca7ba;font-weight:700;border-right:1px solid var(--line)}
.stream-tool-tab:last-child{border-right:0}.stream-tool-tab.active{color:#fff;background:linear-gradient(135deg,#4f84df,#586ee2)}.stream-tool-tab.disabled{opacity:.58}
.url-swap{display:flex;align-items:center;gap:.55rem;max-width:560px}.url-swap code{display:inline-block;max-width:230px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#cdd7ee}.url-swap i{color:#77849a}
@media(max-width:767.98px){.stream-tool-tabs{grid-template-columns:1fr}.stream-tool-tab{justify-content:flex-start;border-right:0;border-bottom:1px solid var(--line)}.stream-tool-tab:last-child{border-bottom:0}.url-swap{align-items:flex-start;flex-direction:column}.url-swap i{transform:rotate(90deg)}}
@media (max-width: 576px){.dashboard-hero{align-items:flex-start;gap:1rem}.dashboard-hero form{width:100%}.dashboard-hero form .btn{width:100%}.dashboard-card .card-body{padding:1rem}.app-main{padding-left:.75rem!important;padding-right:.75rem!important}.table{font-size:.86rem}}