.stats{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.settings-row{display:grid;grid-template-columns:minmax(170px,1fr) minmax(120px,.45fr) auto;gap:12px;align-items:end;margin-top:18px;padding:15px;border-radius:14px;background:rgba(255,255,255,.035);border:1px solid var(--line)}
.settings-row label{font-size:12px;font-weight:800;color:var(--muted)}
.settings-row input{margin-top:5px}
.primary.small{padding:12px 14px;white-space:nowrap}
.actions .danger,.danger{color:#ff95aa;border-color:rgba(255,107,138,.28);background:rgba(255,107,138,.08)}
.actions.compact{margin-top:0;align-items:center}
.check{display:flex;align-items:center;gap:7px;color:var(--muted);font-weight:700}
.check input{width:auto;margin:0}
.log-entry{padding:18px}
.log-path{display:block;max-width:850px;color:var(--muted);font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;word-break:break-all}
.error-detail{margin:13px 0 0;padding:10px;border-radius:9px;color:#ff9ab0;background:rgba(255,107,138,.08);border:1px solid rgba(255,107,138,.18)}
.stream-stat-link{cursor:pointer;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.stream-stat-link:hover{transform:translateY(-2px);border-color:rgba(130,92,255,.48);box-shadow:0 15px 35px rgba(63,31,132,.2)}
.stream-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:18px}
.stream-summary-card{padding:18px 20px}
.stream-summary-card span{display:block;color:var(--muted);font-size:13px;font-weight:700;margin-bottom:8px}
.stream-summary-card strong{font-size:25px}
.active-stream-card{padding:21px}
.live-heading{display:flex;align-items:center;gap:9px}
.live-heading h4{margin:0}
.live-dot{width:10px;height:10px;border-radius:50%;background:#73f4c1;box-shadow:0 0 0 6px rgba(115,244,193,.08),0 0 18px rgba(115,244,193,.55);animation:streamPulse 1.8s ease-in-out infinite}
.stream-device{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-top:17px;padding:13px 15px;border-radius:12px;background:rgba(255,255,255,.035);border:1px solid var(--line)}
.stream-details{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:15px}
.stream-details span{padding:12px;border-radius:11px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.055)}
.stream-details small{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
.stream-details b{font-size:13px;line-height:1.45;word-break:break-word}
.stream-expiry{color:#73f4c1}
.user-agent{margin-top:14px;padding:11px 13px;border-radius:10px;background:rgba(255,255,255,.025);border:1px solid var(--line)}
.user-agent summary{cursor:pointer;color:var(--muted);font-size:12px;font-weight:700}
.user-agent code{display:block;margin-top:10px;color:#cfc5e8;font-size:11px;line-height:1.55;white-space:normal;word-break:break-all}
.stream-empty{text-align:center;padding:44px 24px}
.stream-empty h4{margin:8px 0}
.stream-empty-icon{width:48px;height:48px;margin:0 auto 12px;display:grid;place-items:center;border-radius:15px;background:rgba(125,84,255,.13);color:#9d7bff;font-size:20px}
.mobile-menu-button,.mobile-menu-close,.mobile-nav-overlay{display:none}

@keyframes streamPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.58;transform:scale(.86)}}

@media(max-width:1100px){
  .stream-details{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:760px){
  body{background-attachment:fixed}
  body.mobile-menu-open{overflow:hidden}
  .page{padding:10px 12px 22px}
  .panel{border-radius:17px}
  .app{display:block;max-width:none}
  .workspace{width:100%}

  .mobile-menu-button{display:flex;width:44px;height:44px;flex:0 0 44px;padding:0;align-items:center;justify-content:center;flex-direction:column;gap:5px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.055);color:#fff}
  .mobile-menu-button span{display:block;width:18px;height:2px;border-radius:999px;background:currentColor}
  .mobile-menu-close{display:grid;position:absolute;top:17px;right:16px;width:38px;height:38px;padding:0;place-items:center;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.055);font-size:27px;line-height:1;color:#fff}
  .mobile-nav-overlay{display:block;position:fixed;inset:0;z-index:44;padding:0;border:0;background:rgba(4,2,8,.68);backdrop-filter:blur(5px);opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease}
  body.mobile-menu-open .mobile-nav-overlay{opacity:1;visibility:visible}

  .sidebar{position:fixed;inset:0 auto 0 0;z-index:45;width:min(86vw,320px);height:100dvh;padding:22px 20px;border-radius:0 22px 22px 0;transform:translateX(-105%);transition:transform .22s ease;overflow:hidden;box-shadow:25px 0 70px rgba(0,0,0,.48)}
  body.mobile-menu-open .sidebar{transform:translateX(0)}
  .sidebar .brand{padding-right:45px}
  .sidebar nav{display:grid;gap:7px;margin:34px 0 18px;overflow-y:auto;overscroll-behavior:contain}
  .sidebar .nav{width:100%;min-height:48px;padding:13px 15px;text-align:left;font-size:15px}
  .sidebar>.ghost{min-height:48px;margin-top:auto}

  .topbar{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:center;margin:0 -4px 14px;padding:8px 4px 12px;background:linear-gradient(to bottom,rgba(9,6,15,.96) 70%,rgba(9,6,15,0));backdrop-filter:blur(12px)}
  .topbar>div:first-of-type{min-width:0}
  .topbar h2{font-size:23px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .topbar .eyebrow{font-size:9px;letter-spacing:1.3px}
  .account{gap:7px;font-size:0}
  .avatar{width:40px;height:40px}

  .section{gap:14px}
  .section-head{align-items:stretch;gap:12px;flex-direction:column}
  .section-head h3{font-size:20px}
  .section-head .actions.compact{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .section-head .actions.compact>*{width:100%;justify-content:center}

  .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .stat{padding:16px;min-height:112px}
  .stat span{font-size:12px;line-height:1.35}
  .stat strong{margin-top:7px;font-size:28px}

  .hero{min-height:0;padding:22px;gap:22px;align-items:flex-start;flex-direction:column}
  .hero h3{font-size:27px;line-height:1.15}
  .hero .muted{margin-bottom:0}
  .hero:after{width:180px;height:180px;right:-85px;top:-95px}
  .pulse{font-size:13px}

  .customer,.addon-card,.active-stream-card,.log-entry{padding:16px}
  .customer-head,.addon-head{gap:12px}
  .customer h4,.addon-card h4{font-size:16px;overflow-wrap:anywhere}
  .badge{flex:0 0 auto}
  .meta{display:grid;grid-template-columns:1fr;gap:7px;margin-top:13px}

  .settings-row{grid-template-columns:1fr;gap:11px;padding:13px}
  .settings-row .primary{width:100%;min-height:46px}
  .form-panel{max-width:none;padding:18px}
  .form-grid{grid-template-columns:1fr;gap:14px;margin-top:18px}
  .wide{grid-column:auto}
  input,select{min-height:47px;font-size:16px}

  .actions{display:grid;grid-template-columns:1fr;gap:8px}
  .actions button,.actions a{display:flex;min-height:45px;width:100%;align-items:center;justify-content:center;text-align:center}
  .result{padding:14px;font-size:12px}
  .manifest{padding:10px;font-size:11px;line-height:1.55}

  .stream-summary{grid-template-columns:1fr;gap:10px;margin-bottom:4px}
  .stream-summary-card{padding:15px 17px}
  .stream-summary-card strong{font-size:23px}
  .stream-details{grid-template-columns:1fr;gap:8px}
  .stream-device{align-items:flex-start;flex-direction:column;gap:5px;padding:12px}
  .user-agent{overflow:hidden}

  .log-path{font-size:11px}
  .check{min-height:44px;padding:0 10px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.035)}
  .check input{min-height:0}

  .login-card{margin:3vh auto;padding:24px 20px}
  .login-card h1{margin-top:30px;font-size:30px}

  .toast{left:12px;right:12px;bottom:12px;text-align:center}
}

@media(max-width:390px){
  .stats{grid-template-columns:1fr}
  .stat{min-height:0}
  .topbar h2{font-size:21px}
  .avatar{width:37px;height:37px}
  .mobile-menu-button{width:40px;height:40px;flex-basis:40px}
}