/* Eyes Up premium theme (Tab, Nov 9 2026) — loaded last; overrides look only, never layout logic. Remove the <link> to roll back. */
:root{--bg:#07090d;--bg2:#0b0f15;--panel:#10151d;--panel2:#161d27;--line:#1f2935;--line2:#2a3746;--txt:#eef3f8;--mut:#8796a8;--mut2:#5f6d7e;
 --acc:#4cc2ff;--acc2:#7c6cff;--ok:#30d987;--warn:#ffb340;--bad:#ff5a6a;--r:16px;--sh:0 1px 0 rgba(255,255,255,.04) inset,0 10px 30px -12px rgba(0,0,0,.7);
 --grad:linear-gradient(135deg,#4cc2ff 0%,#7c6cff 100%);--font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Segoe UI",Roboto,sans-serif}
html,body{background:var(--bg);font-family:var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"tnum" 1,"cv11" 1}
body{background:radial-gradient(1200px 600px at 80% -10%,rgba(124,108,255,.10),transparent 60%),radial-gradient(900px 500px at -10% 10%,rgba(76,194,255,.08),transparent 55%),var(--bg);background-attachment:fixed;min-height:100vh}
::selection{background:rgba(76,194,255,.35)}
*{scrollbar-width:thin;scrollbar-color:#2a3644 transparent}
header{border-bottom:1px solid rgba(255,255,255,.06)}
@media(min-width:641px){header{background:rgba(9,12,17,.72)!important;-webkit-backdrop-filter:saturate(1.6) blur(18px)!important;backdrop-filter:saturate(1.6) blur(18px)!important}}
@media(max-width:640px){header{background:#07090d!important}}
header h1{font-weight:700;letter-spacing:-.02em;font-size:18px}
header h1 small,.acct{font-weight:500;color:var(--mut);letter-spacing:0}
.tab{font-weight:600;font-size:14px;transition:background .18s,color .18s}
.tab.on{background:rgba(76,194,255,.12)!important;color:#fff!important;box-shadow:inset 0 0 0 1px rgba(76,194,255,.25)}
@media(max-width:640px){
 nav#nav{background:rgba(9,12,17,.82)!important;-webkit-backdrop-filter:saturate(1.6) blur(20px);backdrop-filter:saturate(1.6) blur(20px);border-top:1px solid rgba(255,255,255,.07)!important}
 nav#nav .tab{font-size:12px;padding:8px 2px;border-radius:12px}
}
.btn{border-radius:12px;border-color:var(--line2);background:var(--panel2);font-weight:600;transition:transform .12s,background .15s,border-color .15s}
.btn:hover{border-color:#3a4a5d;background:#1b2430}.btn:active{transform:scale(.97)}
.btn.primary{background:var(--grad)!important;border:0!important;color:#fff!important;box-shadow:0 6px 20px -8px rgba(76,194,255,.6)}
input,select{border-radius:12px;background:var(--panel2);border-color:var(--line2);transition:border-color .15s,box-shadow .15s}
input:focus,select:focus{outline:none!important;border-color:var(--acc);box-shadow:0 0 0 3px rgba(76,194,255,.18)}
.search input{background:rgba(22,29,39,.85)!important;border:1px solid var(--line2);padding:14px 16px 14px 44px!important;font-size:16px;border-radius:14px!important;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%238796a8' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='9' cy='9' r='6'/%3E%3Cpath d='m14 14 4 4'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:15px center!important}
.chip{border-color:var(--line2);background:rgba(22,29,39,.7);font-weight:600;font-size:13px;transition:all .15s}
.chip.on{background:rgba(76,194,255,.14);border-color:rgba(76,194,255,.55);color:#fff}
h2{font-size:12px;letter-spacing:.09em;color:var(--mut);font-weight:700}
.card{background:linear-gradient(180deg,#121924,#0f141c)!important;border:1px solid rgba(255,255,255,.06)!important;border-radius:18px!important;box-shadow:var(--sh);transition:transform .18s cubic-bezier(.2,.8,.2,1),border-color .18s,box-shadow .18s!important}
.card:hover{border-color:rgba(76,194,255,.35)!important;transform:translateY(-2px);box-shadow:0 18px 40px -18px rgba(0,0,0,.9),0 0 0 1px rgba(76,194,255,.12)}
.card .cinfo b{font-weight:650;letter-spacing:-.01em}
.thumb,.cam{background:linear-gradient(100deg,#0c1118 30%,#151d28 50%,#0c1118 70%)!important;background-size:300% 100%!important;animation:h2shim 1.6s ease-in-out infinite}
.thumb:has(img.ld),.cam:has(img[src]){animation:none}
@keyframes h2shim{0%{background-position:100% 0}100%{background-position:0 0}}
.thumb img{transition:opacity .35s ease,transform .5s ease}.card:hover .thumb img{transform:scale(1.03)}
.badge{border-radius:8px;font-weight:700;letter-spacing:.02em;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.badge.live{background:rgba(255,59,78,.9)!important;box-shadow:0 0 0 0 rgba(255,59,78,.6);animation:h2pulse 2.4s infinite}
@keyframes h2pulse{0%{box-shadow:0 0 0 0 rgba(255,59,78,.5)}70%{box-shadow:0 0 0 8px rgba(255,59,78,0)}100%{box-shadow:0 0 0 0 rgba(255,59,78,0)}}
.dot{box-shadow:0 0 8px rgba(48,217,135,.7)}.dot.off{box-shadow:0 0 8px rgba(255,90,106,.7)}
.cam{border-radius:14px!important;border-color:rgba(255,255,255,.06)!important;transition:transform .15s,border-color .15s}
.cam:hover{border-color:rgba(76,194,255,.4)!important}
.menu,.mbox{background:rgba(16,21,29,.96)!important;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--line2)!important;border-radius:18px!important;box-shadow:0 30px 80px -20px rgba(0,0,0,.9)}
.toast{border-radius:14px!important;box-shadow:0 16px 40px -12px rgba(0,0,0,.8)}
.view{animation:h2in .28s cubic-bezier(.2,.8,.2,1)}
@keyframes h2in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* login */
#login{background:radial-gradient(800px 500px at 50% -10%,rgba(124,108,255,.25),transparent 60%),radial-gradient(700px 400px at 50% 110%,rgba(76,194,255,.18),transparent 60%),var(--bg)}
.login-card{background:rgba(16,21,29,.78)!important;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.08)!important;border-radius:26px!important;box-shadow:0 40px 100px -30px rgba(0,0,0,.95);padding:34px 28px!important}
.login-card .logo{width:76px!important;height:76px!important;border-radius:20px!important;box-shadow:0 12px 40px -10px rgba(76,194,255,.55)}
.login-card h1{font-size:26px!important;font-weight:800;letter-spacing:-.03em;background:linear-gradient(180deg,#fff,#b9c7d8);-webkit-background-clip:text;background-clip:text;color:transparent}
.login-card .btn.primary{padding:13px;font-size:16px}
.viewer{background:#000}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.vbar{gap:6px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.vbar::-webkit-scrollbar{display:none}
.vbar .btn,.vbar .pill{white-space:nowrap;flex:0 0 auto}
.vbar .pill{max-width:46vw;overflow:hidden;text-overflow:ellipsis}
.vtop{background:linear-gradient(180deg,rgba(0,0,0,.85),rgba(0,0,0,.4))!important}

#menuBtn{font-size:8px!important;letter-spacing:2px;color:#9fb0c2!important}
