/* SNine Admin visual system — presentation only; existing markup and behavior remain unchanged. */
:root {
  --bg:#070b13 !important; --panel:#101827 !important; --panel2:#142038 !important; --panel3:#1b2a48 !important;
  --line:rgba(137,169,222,.17) !important; --text:#f3f7ff !important; --muted:#91a1bd !important;
  --accent:#58a6ff !important; --accent2:#8a6dff !important; --good:#3de0a0 !important; --warn:#ffcb6b !important;
  --bad:#ff7782 !important; --r:16px !important; --shadow:0 22px 60px rgba(0,0,0,.32) !important;
}
html,body{min-height:100%;background:var(--bg)!important}
body{margin:0!important;color:var(--text)!important;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;font-size:13px!important;background:radial-gradient(880px 480px at 78% -10%,rgba(60,126,255,.20),transparent 65%),radial-gradient(720px 420px at 8% 100%,rgba(123,84,255,.13),transparent 68%),linear-gradient(145deg,#080d17 0%,#070b13 52%,#0a1020 100%)!important}
body::before{content:""!important;position:fixed!important;inset:0!important;z-index:-1!important;pointer-events:none!important;opacity:.28!important;background-image:linear-gradient(rgba(138,173,233,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(138,173,233,.045) 1px,transparent 1px)!important;background-size:38px 38px!important;mask-image:linear-gradient(to bottom,#000,transparent 78%)!important}

/* Frame */
.shell{grid-template-columns:250px minmax(0,1fr)!important;min-height:100vh!important;background:transparent!important}
.sidebar{position:sticky!important;top:0!important;height:100vh!important;padding:20px 13px!important;border-right:1px solid var(--line)!important;background:linear-gradient(180deg,rgba(11,18,32,.96),rgba(8,13,24,.94))!important;box-shadow:inset -1px 0 rgba(255,255,255,.018)!important;backdrop-filter:blur(22px)!important;-webkit-backdrop-filter:blur(22px)!important;overflow-y:auto!important}
.main{min-width:0!important;padding:0 34px 46px!important}
.topbar{position:sticky!important;top:0!important;z-index:15!important;min-height:78px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;border-bottom:1px solid rgba(137,169,222,.12)!important;background:linear-gradient(180deg,rgba(7,11,19,.91),rgba(7,11,19,.68))!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important}
.top-title h1{margin:0!important;font-size:20px!important;letter-spacing:-.025em!important;font-weight:760!important}.top-title p{margin:3px 0 0!important;color:var(--muted)!important;font-size:12px!important}.top-actions{display:flex!important;align-items:center!important;gap:8px!important}

/* Brand and navigation */
.brand{display:flex!important;align-items:center!important;gap:11px!important;padding:3px 8px 23px!important}
.logo,.login-logo{display:grid!important;place-items:center!important;overflow:hidden!important;color:transparent!important;background:linear-gradient(145deg,rgba(97,169,255,.22),rgba(112,88,255,.18))!important;border:1px solid rgba(133,183,255,.31)!important;border-radius:13px!important;box-shadow:0 12px 28px rgba(34,100,225,.18),inset 0 1px rgba(255,255,255,.16)!important}
.logo{width:40px!important;height:40px!important;flex:0 0 40px!important}.login-logo{width:58px!important;height:58px!important;margin:0 0 16px!important;border-radius:18px!important}.snc-brand-image{width:77%!important;height:77%!important;display:block!important;object-fit:contain!important}.brand strong{font-size:14px!important;font-weight:780!important;letter-spacing:-.015em!important}.brand span{display:block!important;margin-top:2px!important;color:var(--muted)!important;font-size:10px!important}
.nav-label{margin:16px 10px 7px!important;color:#71809c!important;font-size:9px!important;font-weight:800!important;letter-spacing:.13em!important;text-transform:uppercase!important}.nav{display:grid!important;gap:3px!important}
.nav button{position:relative!important;min-height:38px!important;width:100%!important;padding:8px 10px!important;border:1px solid transparent!important;border-radius:10px!important;background:transparent!important;color:#aab8d1!important;font-size:12px!important;font-weight:600!important;text-align:left!important;transition:border-color .17s ease,background .17s ease,color .17s ease,transform .17s ease!important}
.nav button:hover{color:#f4f7ff!important;background:rgba(91,141,225,.095)!important;transform:translateX(2px)!important}
.nav button.active{color:#fff!important;border-color:rgba(107,168,255,.28)!important;background:linear-gradient(100deg,rgba(69,142,255,.25),rgba(109,81,255,.14))!important;box-shadow:inset 0 1px rgba(255,255,255,.09),0 8px 18px rgba(29,79,174,.12)!important}
.nav button.active::before{content:""!important;position:absolute!important;left:-14px!important;top:10px!important;bottom:10px!important;width:3px!important;border-radius:999px!important;background:linear-gradient(var(--accent),var(--accent2))!important}.nav-i{width:20px!important;opacity:.9!important}
.sidebar-status{margin-top:21px!important;padding:12px!important;border:1px solid var(--line)!important;border-radius:12px!important;background:rgba(18,30,52,.66)!important;box-shadow:inset 0 1px rgba(255,255,255,.045)!important}.dot.on{box-shadow:0 0 0 4px rgba(61,224,160,.10),0 0 16px rgba(61,224,160,.48)!important}.sidebar-backdrop{display:none!important}

/* Content */
.view{padding-top:28px!important}.hero{align-items:flex-end!important;gap:18px!important;margin:0 0 20px!important}.hero h2{margin:0 0 4px!important;font-size:27px!important;font-weight:780!important;letter-spacing:-.035em!important}.hero p{margin:0!important;color:var(--muted)!important;font-size:13px!important}.grid{gap:16px!important}.metrics{gap:14px!important;margin-bottom:16px!important}
.metric,.card{border:1px solid rgba(137,169,222,.16)!important;border-radius:var(--r)!important;background:linear-gradient(145deg,rgba(21,32,56,.92),rgba(12,20,36,.95))!important;box-shadow:inset 0 1px rgba(255,255,255,.055),0 15px 36px rgba(0,0,0,.16)!important}.metric{padding:18px!important}.metric::after{opacity:.28!important}.metric span,.metric small,.sub,.muted{color:var(--muted)!important}.metric strong{margin-top:8px!important;font-size:27px!important;font-weight:780!important;letter-spacing:-.04em!important}.card{padding:18px!important}.card-head{margin-bottom:14px!important}.card h3{font-size:14px!important;font-weight:750!important}.divider{background:var(--line)!important}

/* Controls */
.btn,button.btn{min-height:36px!important;padding:7px 12px!important;border:1px solid rgba(139,167,214,.23)!important;border-radius:10px!important;background:rgba(28,43,72,.72)!important;color:#eaf1ff!important;font-size:11px!important;font-weight:700!important;box-shadow:inset 0 1px rgba(255,255,255,.07)!important;transform:none!important;transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease!important}
.btn:hover{transform:translateY(-1px)!important;background:rgba(42,63,101,.84)!important;border-color:rgba(116,174,255,.52)!important;box-shadow:0 10px 20px rgba(0,0,0,.16),inset 0 1px rgba(255,255,255,.09)!important}.btn.primary{border-color:rgba(128,191,255,.55)!important;background:linear-gradient(135deg,#3588ee,#6e62ed)!important;color:#fff!important;box-shadow:0 10px 24px rgba(48,115,238,.28),inset 0 1px rgba(255,255,255,.22)!important}.btn.primary:hover{background:linear-gradient(135deg,#4a9af7,#7d70f3)!important}.btn.danger{background:rgba(98,35,48,.65)!important;border-color:rgba(255,119,130,.40)!important;color:#ffd8dc!important}.btn.good{background:rgba(28,104,78,.42)!important;border-color:rgba(61,224,160,.37)!important;color:#b3ffe0!important}.btn.warn{background:rgba(108,76,25,.44)!important;border-color:rgba(255,203,107,.37)!important;color:#ffdea0!important}.btn.small{min-height:29px!important;padding:4px 9px!important;font-size:10px!important;border-radius:8px!important}.btn.icon{width:36px!important;min-width:36px!important;padding:0!important}.search-btn{min-width:250px!important;justify-content:flex-start!important;color:var(--muted)!important}.kbd{border-color:rgba(137,169,222,.25)!important;background:rgba(7,12,22,.56)!important;color:#9aa9c2!important}.user{padding:5px 7px!important;border:1px solid rgba(137,169,222,.17)!important;border-radius:12px!important;background:rgba(18,29,50,.75)!important;box-shadow:inset 0 1px rgba(255,255,255,.045)!important}.avatar{width:31px!important;height:31px!important;border-radius:9px!important;background:linear-gradient(135deg,#4b9dff,#7b62ef)!important}
.input,input.input,select,textarea{border:1px solid rgba(137,169,222,.22)!important;border-radius:10px!important;background:rgba(7,13,25,.66)!important;color:var(--text)!important;box-shadow:inset 0 1px rgba(0,0,0,.2)!important}.input,input.input,select{height:38px!important;padding:0 10px!important}textarea{padding:10px!important}.input:focus,input.input:focus,select:focus,textarea:focus{border-color:var(--accent)!important;box-shadow:0 0 0 3px rgba(88,166,255,.14),inset 0 1px rgba(0,0,0,.2)!important}.field label{color:#a5b3cd!important;font-size:9px!important;letter-spacing:.08em!important}

/* Data-heavy views */
.table-wrap{border:1px solid var(--line)!important;border-radius:12px!important;background:rgba(9,15,27,.59)!important;overflow:auto!important}.table-wrap::-webkit-scrollbar,.list::-webkit-scrollbar{width:8px;height:8px}.table-wrap::-webkit-scrollbar-thumb,.list::-webkit-scrollbar-thumb{border-radius:999px;background:rgba(143,169,215,.25)}thead,th{background:rgba(20,32,54,.95)!important}th{padding:10px 11px!important;border-bottom:1px solid var(--line)!important;color:#9dacc5!important;font-size:9px!important;font-weight:800!important;letter-spacing:.09em!important}td{padding:11px!important;border-bottom:1px solid rgba(137,169,222,.11)!important;color:#e7efff!important;font-size:11px!important}tbody tr:hover{background:rgba(67,111,181,.12)!important}
.list-item,.workspace-row,.status-card,.setting-row,.security-stat,.readiness-row,.timeline-item{border-color:var(--line)!important;border-radius:10px!important;background:rgba(13,23,41,.72)!important;box-shadow:inset 0 1px rgba(255,255,255,.035)!important}.list-item:hover,.list-item.active{border-color:rgba(93,168,255,.52)!important;background:rgba(55,110,192,.17)!important}.timeline-dot{background:var(--accent)!important;box-shadow:0 0 12px rgba(88,166,255,.7)!important}.asset{border-color:var(--line)!important;border-radius:12px!important;background:rgba(12,21,38,.8)!important}.asset-preview{background-color:#0c1424!important}.drop{border-color:rgba(88,166,255,.48)!important;border-radius:12px!important;background:rgba(48,103,187,.09)!important}.drop.drag{background:rgba(48,133,255,.18)!important}
.pill{border-color:rgba(137,169,222,.25)!important;background:rgba(20,32,55,.75)!important;color:#b8c8e3!important;box-shadow:inset 0 1px rgba(255,255,255,.04)!important}.pill.good{background:rgba(23,105,75,.35)!important;border-color:rgba(61,224,160,.32)!important;color:#9cf1c9!important}.pill.warn{background:rgba(116,80,24,.37)!important;border-color:rgba(255,203,107,.33)!important;color:#ffdd9a!important}.pill.bad{background:rgba(118,40,55,.37)!important;border-color:rgba(255,119,130,.35)!important;color:#ffb3ba!important}.progress{background:rgba(7,13,25,.80)!important}.progress>span{background:linear-gradient(90deg,var(--accent),var(--accent2))!important}

/* Login, dialogs and asset management */
.modal,.login{background:rgba(3,7,14,.76)!important;backdrop-filter:blur(10px)!important}.modal-card,.login-card,.palette{border:1px solid rgba(143,182,241,.23)!important;border-radius:18px!important;background:linear-gradient(145deg,rgba(21,34,59,.98),rgba(10,17,31,.98))!important;box-shadow:0 28px 80px rgba(0,0,0,.52),inset 0 1px rgba(255,255,255,.08)!important}.login-card{max-width:460px!important;padding:30px!important}.login-card h1{font-size:24px!important;letter-spacing:-.035em!important}.login-box{border-color:rgba(88,166,255,.27)!important;border-radius:13px!important;background:rgba(35,86,171,.12)!important}.command,.codebox{border:1px solid var(--line)!important;border-radius:10px!important;background:rgba(5,11,21,.68)!important}.snine-icon-card,.snine-selected-icon,.snine-icon-preview,.snine-upload-drop{border-color:var(--line)!important;border-radius:11px!important;background:rgba(12,21,38,.78)!important}.snine-icon-card:hover{border-color:rgba(88,166,255,.48)!important;background:rgba(39,76,135,.28)!important;transform:translateY(-2px)!important}.snine-icon-card.selected{border-color:rgba(121,105,255,.68)!important;background:rgba(98,75,190,.19)!important}

@media(max-width:1100px){.shell{grid-template-columns:224px minmax(0,1fr)!important}.main{padding:0 20px 34px!important}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important}.two,.three{grid-template-columns:1fr!important}.search-btn{min-width:170px!important}}
@media(max-width:760px){.shell{grid-template-columns:1fr!important}.sidebar{position:fixed!important;left:0!important;transform:translateX(-105%)!important;width:250px!important;z-index:50!important;transition:transform .22s ease!important}.sidebar.open{transform:translateX(0)!important}.main{padding:0 14px 28px!important}.topbar{min-height:62px!important}.top-actions .search-btn,.top-actions .user>div:not(.avatar){display:none!important}.mobile{display:inline-grid!important}.metrics,.form,.permissions{grid-template-columns:1fr!important}.hero{align-items:flex-start!important;flex-direction:column!important}.hero h2{font-size:23px!important}.sidebar-backdrop{display:block!important;position:fixed!important;inset:0!important;z-index:49!important;background:rgba(0,0,0,.58)!important;opacity:0!important;pointer-events:none!important;transition:opacity .2s ease!important}.sidebar-backdrop.open{opacity:1!important;pointer-events:auto!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}