/* Shared interior sidebar. Values and DOM order come from the approved Home.
   No route, active section or Studio selector owns sidebar geometry. */
body.clipsyra-web2-reference-layout #app{--web2-sidebar-width:244px}
@media(max-width:1439px){body.clipsyra-web2-reference-layout #app{--web2-sidebar-width:220px}}
@media(max-width:1199px){body.clipsyra-web2-reference-layout #app{--web2-sidebar-width:196px}}
@media(max-width:820px){body.clipsyra-web2-reference-layout #app{--web2-sidebar-width:0px}}
body.clipsyra-web2-clean .clipsyra-sidebar,body.clipsyra-web2-clean .sidebar{background:linear-gradient(180deg,rgba(3,7,24,.96),rgba(4,8,24,.99))!important;border-right:1px solid rgba(103,126,255,.24)!important;box-shadow:14px 0 48px rgba(0,0,0,.30)!important}
body.clipsyra-web2-clean .clipsyra-nav button,body.clipsyra-web2-clean .nav button{border:1px solid transparent!important;border-radius:14px!important;color:#aab6d2!important;background:transparent!important;transition:.18s ease!important}
body.clipsyra-web2-clean .clipsyra-nav button:hover,body.clipsyra-web2-clean .nav button:hover{color:#fff!important;background:rgba(74,115,255,.10)!important;border-color:rgba(99,128,255,.22)!important}
body.clipsyra-web2-clean .clipsyra-nav button.active,body.clipsyra-web2-clean .nav button.active{color:#fff!important;background:linear-gradient(135deg,rgba(103,68,255,.52),rgba(32,118,255,.22))!important;border-color:rgba(117,143,255,.55)!important;box-shadow:0 0 26px rgba(79,83,255,.18),inset 0 1px rgba(255,255,255,.05)!important}
body.clipsyra-web2-clean .web2-sidebar .clipsyra-logo-horizontal:after{content:none}
body.clipsyra-web2-clean .web2-sidebar .clipsyra-logo-main{display:inline-flex;align-items:baseline;white-space:nowrap}
body.clipsyra-web2-clean .web2-sidebar .clipsyra-logo-main:after{content:"2.0";margin-left:4px;color:#d349ff;font-weight:950;font-size:.88em;letter-spacing:-.025em;text-shadow:0 0 12px rgba(211,73,255,.18)}
body.clipsyra-web2-clean .web2-nav-group-label{margin:16px 10px 6px;padding-top:11px;border-top:1px solid rgba(93,116,207,.24);color:#9daac7;font-size:9px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}
body.clipsyra-web2-clean .web2-sidebar .clipsyra-nav button{transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease}
body.clipsyra-web2-clean .web2-sidebar .clipsyra-nav button:hover{transform:translateX(2px);background:rgba(43,49,127,.48)}
body.clipsyra-web2-clean .web2-sidebar .clipsyra-nav button.active{border-color:rgba(112,80,255,.86)!important;background:linear-gradient(100deg,#7d2df0,#6438e7 62%,#11bfff)!important;box-shadow:0 0 18px rgba(91,55,255,.24)!important}
body.clipsyra-web2-reference-layout .clipsyra-sidebar,
body.clipsyra-web2-reference-layout .sidebar,
body.clipsyra-web2-reference-layout aside.sidebar{
  position:fixed!important;
  left:0!important;top:0!important;bottom:0!important;
  width:var(--web2-sidebar-width)!important;
  min-width:var(--web2-sidebar-width)!important;
  max-width:var(--web2-sidebar-width)!important;
  height:100vh!important;
  max-height:100vh!important;
  padding:18px 12px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  z-index:90!important;
  background:linear-gradient(180deg,rgba(3,7,22,.99),rgba(4,8,28,.98))!important;
  border-right:1px solid rgba(94,128,255,.22)!important;
  scrollbar-width:thin!important;
}
body.clipsyra-web2-reference-layout .clipsyra-sidebar .brand,
body.clipsyra-web2-reference-layout .sidebar .brand,
body.clipsyra-web2-reference-layout .logo,
body.clipsyra-web2-reference-layout .brand-logo{max-width:100%!important;overflow:hidden!important;}
body.clipsyra-web2-reference-layout .clipsyra-nav,
body.clipsyra-web2-reference-layout .nav{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:8px!important;
  width:100%!important;
  max-height:none!important;
  overflow:visible!important;
  padding:6px 0 28px!important;
}
body.clipsyra-web2-reference-layout .clipsyra-nav button,
body.clipsyra-web2-reference-layout .nav button{
  width:100%!important;
  min-height:42px!important;
  height:auto!important;
  padding:9px 11px!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:10px!important;
  font-size:13.5px!important;
  line-height:1.15!important;
  text-align:left!important;
  border-radius:14px!important;
  white-space:normal!important;
  overflow:visible!important;
}
body.clipsyra-web2-reference-layout .clipsyra-nav button span:not(.nav-icon),
body.clipsyra-web2-reference-layout .nav button span:not(.nav-icon){display:inline!important;max-width:118px!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;}
body.clipsyra-web2-reference-layout .clipsyra-sidebar [aria-hidden="true"],
body.clipsyra-web2-reference-layout .sidebar [aria-hidden="true"]{display:flex!important;}
body.clipsyra-web2-reference-layout .web2-sidebar{
  width:var(--web2-sidebar-width)!important;
  min-width:var(--web2-sidebar-width)!important;
  max-width:var(--web2-sidebar-width)!important;
  padding:18px 12px 14px!important;
  overflow:hidden!important;
}
body.clipsyra-web2-reference-layout .web2-sidebar .clipsyra-logo-horizontal{
  flex:0 0 auto!important;
  padding:2px 8px 14px!important;
}
body.clipsyra-web2-reference-layout .web2-sidebar .clipsyra-nav{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:4px 4px 16px!important;
  gap:5px!important;
  scrollbar-width:none!important;
}
body.clipsyra-web2-reference-layout .web2-sidebar .clipsyra-nav::-webkit-scrollbar{display:none!important}
body.clipsyra-web2-reference-layout .web2-sidebar .clipsyra-nav button{
  min-height:42px!important;
  padding:9px 12px!important;
  border-radius:13px!important;
  font-size:13px!important;
}
body.clipsyra-web2-reference-layout .web2-sidebar-footer{
  flex:0 0 auto!important;
  display:grid!important;
  gap:8px!important;
  padding-top:10px!important;
  border-top:1px solid rgba(100,124,255,.16)!important;
}
body.clipsyra-web2-reference-layout .web2-plan-card,
body.clipsyra-web2-reference-layout .web2-sidebar-profile{
  width:100%!important;
  border:1px solid rgba(111,132,255,.28)!important;
  border-radius:14px!important;
  background:linear-gradient(135deg,rgba(98,66,255,.16),rgba(6,13,38,.88))!important;
  color:#fff!important;
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr) auto!important;
  gap:9px!important;
  align-items:center!important;
  padding:10px!important;
  text-align:left!important;
}
body.clipsyra-web2-reference-layout .web2-plan-card b,
body.clipsyra-web2-reference-layout .web2-sidebar-profile b{display:block!important;font-size:11px!important}
body.clipsyra-web2-reference-layout .web2-plan-card small,
body.clipsyra-web2-reference-layout .web2-sidebar-profile small{display:block!important;font-size:9px!important;color:#91a2d6!important;margin-top:2px!important}
body.clipsyra-web2-reference-layout .web2-sidebar-profile div{min-width:0!important}
body.clipsyra-web2-reference-layout .web2-sidebar-profile b{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
@media(max-width:1380px){body.clipsyra-web2-reference-layout .web2-sidebar{width:210px!important;min-width:210px!important;max-width:210px!important}}
@media(max-width:820px){body.clipsyra-web2-reference-layout #app .clipsyra-sidebar{z-index:140!important}}
body.clipsyra-web2-reference-layout #app .clipsyra-sidebar{width:var(--web2-sidebar-width)!important;min-width:var(--web2-sidebar-width)!important;max-width:var(--web2-sidebar-width)!important}
body.clipsyra-web2-reference-layout #app .clipsyra-sidebar{padding:16px 14px!important;background:#04091a!important}
body.clipsyra-web2-reference-layout #app .clipsyra-logo-horizontal{height:54px!important;min-height:54px!important;margin-bottom:14px!important}
body.clipsyra-web2-reference-layout #app .clipsyra-brand-interior img{width:198px!important;height:auto!important;max-height:66px!important;object-fit:contain!important}
body.clipsyra-web2-reference-layout #app .clipsyra-nav{gap:4px!important;padding-bottom:12px!important}
body.clipsyra-web2-reference-layout #app .clipsyra-nav button{min-height:44px!important;padding:10px 12px!important;font-size:15px!important;border-radius:10px!important}
body.clipsyra-web2-reference-layout #app .clipsyra-nav button span:not(.nav-icon){max-width:none!important}
body.clipsyra-web2-reference-layout #app .clipsyra-nav .nav-icon{width:24px!important;font-size:22px!important;text-align:center}
body.clipsyra-web2-reference-layout #app .clipsyra-nav button.active{background:linear-gradient(105deg,#6934db,#2e6bb6)!important;border:1px solid #8754ee!important}
body.clipsyra-web2-reference-layout #app .web2-nav-group-label{font-size:12px!important;letter-spacing:.08em;margin-top:16px!important}
@media(max-width:820px){body.clipsyra-web2-reference-layout #app .clipsyra-sidebar{width:min(86vw,300px)!important;min-width:0!important;max-width:300px!important}}
body.clipsyra-web2-reference-layout #app .clipsyra-sidebar{padding:16px 10px 24px!important;background:#030917!important;display:flex;flex-direction:column;overflow-y:auto;scrollbar-width:none!important;-ms-overflow-style:none!important}
body.clipsyra-web2-reference-layout #app .clipsyra-sidebar::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}
body.clipsyra-web2-reference-layout #app .clipsyra-logo-horizontal{margin:0 8px 20px;height:51px;min-height:51px}
body.clipsyra-web2-reference-layout #app .clipsyra-nav{gap:0!important;padding:0!important;flex:0 0 auto!important;overflow:visible!important;margin-top:0}
body.clipsyra-web2-reference-layout #app .clipsyra-nav button{min-height:47px!important;padding:8px 15px!important;font-size:16px!important;color:#f7f8ff!important;margin:0;gap:18px}
body.clipsyra-web2-reference-layout #app .clipsyra-nav button[data-page="home"]{min-height:50px!important}
body.clipsyra-web2-reference-layout #app .clipsyra-nav button.active{background:linear-gradient(105deg,#9a2aff,#641ec2 72%,#03bafd)!important;box-shadow:inset -6px 0 16px #00aaff80,0 0 16px #6532c044;border-color:#9c52ff!important}
body.clipsyra-web2-reference-layout #app .clipsyra-nav .nav-icon{display:flex;width:28px;min-width:28px;color:white}
body.clipsyra-web2-reference-layout #app .clipsyra-nav .nav-icon svg{width:28px;height:28px}
body.clipsyra-web2-reference-layout #app .clipsyra-nav button span:not(.nav-icon){max-width:none!important;white-space:nowrap!important}
@media(max-width:820px){body.clipsyra-web2-reference-layout #app .clipsyra-sidebar{z-index:140!important}}
@media(max-width:820px){body.clipsyra-web2-reference-layout.clipsyra-mobile-nav-open #app .clipsyra-sidebar{transform:translateX(0)}}
.home2-logo-version{display:none}
body.clipsyra-web2-reference-layout #app .clipsyra-brand-interior{display:flex;align-items:center;gap:4px}
body.clipsyra-web2-reference-layout #app .clipsyra-brand-interior img{width:165px!important}
body.clipsyra-web2-reference-layout .home2-logo-version{display:inline;color:#e650f9;font-size:24px;line-height:1;font-weight:850;white-space:nowrap}
body.clipsyra-web2-reference-layout #app .web2-nav-group-label{margin:17px 12px 5px!important;padding-top:16px;font-size:14px!important;font-weight:400;letter-spacing:0!important}
body.clipsyra-web2-reference-layout #app .web2-nav-group-label:nth-of-type(2),body.clipsyra-web2-reference-layout #app .web2-nav-group-label:nth-of-type(2)~button,body.clipsyra-web2-reference-layout #app .clipsyra-nav button[data-page="myclips"]{display:none!important}
.home2-sidebar-plan{display:none}
body.clipsyra-web2-reference-layout #app .web2-sidebar-footer,body.clipsyra-web2-reference-layout #app .studio-syra-coeditor{display:none!important}
body.clipsyra-web2-reference-layout .home2-sidebar-plan{display:block;margin:auto 0 0;padding:19px 14px 16px;border:1px solid #7464c7;border-radius:14px;background:linear-gradient(135deg,#111027,#06112e);flex-shrink:0}
.home2-sidebar-plan>div:first-child{display:flex;align-items:center;gap:12px;text-transform:capitalize}
.home2-sidebar-plan svg{width:28px;height:28px;color:#ffdc29}
.home2-sidebar-plan b{font-size:14px}
.home2-sidebar-plan small{display:block;font-size:13px;margin:3px 0 0 47px;line-height:1.4}
.home2-plan-meter{height:7px;background:#202348;border-radius:8px;margin:12px 0 12px 47px;overflow:hidden}
.home2-plan-meter i{display:block;width:0;height:100%;background:linear-gradient(90deg,#a033ee,#dd98ff)}
.home2-sidebar-plan button{width:100%;height:48px;border:1px solid #ab55ff;border-radius:10px;background:linear-gradient(105deg,#a147ff,#5148ff,#00bdf2);color:white;font-weight:700;cursor:pointer}
@media(max-width:820px){body.clipsyra-web2-reference-layout #app .clipsyra-sidebar{width:min(86vw,300px)!important;min-width:0!important;max-width:300px!important}}
