*{box-sizing:border-box}:root{--bg:#030b18;--panel:#07172d;--text:#f3f6fc;--muted:#a9b8cf;--line:#1d3a61;--gold:#f6bd22;--blue:#4b8dff;--viewer-size:16px}body.light{--bg:#f3f6fb;--panel:#fff;--text:#11213a;--muted:#62738d;--line:#d8e1ed}body{margin:0;background:radial-gradient(circle at 70% 5%,#0d284a 0,#030b18 38%);color:var(--text);font-family:Segoe UI,Arial,sans-serif;min-height:100vh}body.light{background:var(--bg)}.header{height:90px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 3.5%;background:rgba(2,10,23,.94);position:sticky;top:0;z-index:10}.brand{display:flex;align-items:center;gap:15px;color:inherit;text-decoration:none}.logo-box{position:relative;display:grid;place-items:center}.logo-box.small{width:62px;height:62px}.logo-box.small img{width:62px}.brand-title{font-size:25px;font-weight:750}.brand-sub{font-size:16px;color:#b8c7dc;margin-top:2px}.header-right{display:flex;gap:30px;align-items:center}.theme,.reset-btn{border:1px solid #526783;background:#10233e;color:white;border-radius:22px;padding:8px 13px;cursor:pointer}.admin{font-size:16px}.layout{display:flex;min-height:calc(100vh - 140px)}.sidebar{width:235px;border-right:1px solid var(--line);padding:42px 14px 20px;background:rgba(2,12,26,.7);display:flex;flex-direction:column}.nav{display:block;padding:15px 17px;margin:4px 0;color:#bdcbe0;text-decoration:none;border-radius:10px;font-size:16px}.nav b{display:inline-block;width:32px;font-size:20px}.nav.active{background:linear-gradient(90deg,#a87913,#f2b923);color:#07101e;font-weight:700}.side-brand{margin-top:auto;text-align:center;padding:25px 10px}.orbit-mini{height:115px;position:relative;display:grid;place-items:center}.orbit-mini:before,.orbit-mini:after{content:"";position:absolute;border:1px solid #e4a91b;border-radius:50%;width:130px;height:45px;transform:rotate(-22deg);box-shadow:0 0 15px #d99916}.orbit-mini:after{transform:rotate(22deg);border-color:#416ea8}.orbit-mini img{width:105px;position:relative;z-index:1}.slogan{font-size:17px;color:#fff;margin-top:8px;line-height:1.4}.slogan em{color:var(--gold);font-style:normal}.main{flex:1;min-width:0;padding:22px 28px 45px}.hero{min-height:265px;border:1px solid var(--line);border-radius:17px;overflow:hidden;background:linear-gradient(110deg,#061b36,#020b18 75%);display:flex;align-items:center;padding:20px 6%;position:relative}.hero-logo{width:360px;height:230px;display:grid;place-items:center;position:relative}.logo-box.big img{width:245px;filter:drop-shadow(0 12px 12px rgba(0,0,0,.6));animation:float 4s ease-in-out infinite}.orbit{position:absolute;border:2px solid var(--gold);border-radius:50%;width:315px;height:95px;transform:rotate(-12deg);box-shadow:0 0 16px rgba(246,189,34,.45);animation:spin 8s linear infinite}.orbit.o2{width:280px;height:75px;transform:rotate(18deg);border-color:#4b8dff;opacity:.65;animation-direction:reverse}@keyframes float{50%{transform:translateY(-9px) rotateY(7deg)}}@keyframes spin{to{transform:rotate(348deg)}}.hero-copy{position:relative;z-index:2}.hero h1{font-size:40px;margin:0 0 5px}.hero h1 span,.files-heading h2 span,.settings-page h2 span{color:var(--gold)}.hero h2{font-size:27px;font-weight:400;margin:0;color:#d8e3f5}.gold-line{width:85px;height:4px;background:var(--gold);margin:19px 0;border-radius:5px}.hero p{font-size:16px;color:#c4d1e4}.primary-btn{display:inline-block;margin-top:5px;background:var(--gold);color:#081321;text-decoration:none;font-weight:750;padding:11px 17px;border-radius:8px}.files-section{padding:28px 10px}.files-heading{display:flex;align-items:end;justify-content:space-between;gap:25px}.files-heading h2{font-size:29px;margin:0}.files-heading p{color:var(--muted);margin:7px 0 0}.search{height:49px;min-width:340px;border:1px solid #315174;background:#0a203d;border-radius:26px;display:flex;align-items:center;padding:0 17px}.search span{font-size:25px;color:#c6d6ec}.search input{border:0;outline:0;background:transparent;color:#fff;font-size:15px;width:100%;padding-left:10px}.status{color:var(--muted);font-size:13px;margin:22px 0 10px}.file-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.card{display:flex;align-items:center;gap:13px;padding:18px;background:linear-gradient(145deg,#0a1c34,#061326);border:1px solid #21466e;border-radius:14px;text-decoration:none;color:white;transition:.18s;min-height:84px}.large-cards .card{min-height:105px;padding:22px}.card:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:0 8px 28px rgba(0,0,0,.3)}.file-icon{width:48px;height:54px;display:grid;place-items:center;flex:none;border-radius:9px 9px 9px 3px;background:#3488ff;color:white;font-weight:800;font-size:11px;position:relative}.file-icon:after{content:"";position:absolute;right:0;top:0;border-left:12px solid transparent;border-bottom:12px solid #b9dcff}.c1{background:#36bd68}.c2{background:#8b67e9}.c3{background:#f59b18}.c4{background:#17b8c9}.c5{background:#e84d88}.card-info{min-width:0;flex:1}.file-name{font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-meta{font-size:12px;color:#8ea6c4;margin-top:7px}.open{color:var(--gold);font-size:13px;font-weight:700;white-space:nowrap}.empty{grid-column:1/-1;padding:35px;text-align:center;border:1px dashed var(--line);border-radius:12px;color:var(--muted)}.settings-page{padding:30px 10px}.settings-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.settings-page h2{font-size:29px;margin:0}.settings-page p{color:var(--muted);margin:7px 0 0}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.setting-card{background:linear-gradient(145deg,#081a31,#061326);border:1px solid #21466e;border-radius:14px;padding:20px}.setting-card h3{margin:0 0 16px;font-size:17px}.setting-row,.select-row{min-height:58px;border-top:1px solid rgba(100,130,160,.18);display:flex;align-items:center;justify-content:space-between;gap:20px}.setting-row:first-of-type,.select-row:first-of-type{border-top:0}.setting-row strong{display:block}.setting-row small{display:block;color:var(--muted);margin-top:4px}.switch{display:none}.setting-row i{width:46px;height:25px;background:#34465c;border-radius:30px;position:relative;flex:none;cursor:pointer}.setting-row i:after{content:"";position:absolute;width:19px;height:19px;border-radius:50%;background:#dce6f2;left:3px;top:3px;transition:.2s}.switch:checked+i{background:var(--gold)}.switch:checked+i:after{left:24px;background:#111d2d}.select-row select{background:#0c223e;color:white;border:1px solid #315174;border-radius:7px;padding:8px 10px;min-width:150px}.action-btn{margin-top:16px;width:100%;padding:11px;background:#102b4b;border:1px solid #315174;color:#fff;border-radius:8px;cursor:pointer}.info{display:flex;justify-content:space-between;gap:15px;padding:9px 0;border-top:1px solid rgba(100,130,160,.18);font-size:13px}.info:first-of-type{border-top:0}.info span{color:var(--muted)}.online{color:#52d38a}.security p,.setting-card ol{font-size:13px;line-height:1.7}.security-note{padding:10px;border-radius:8px;background:#102a23;color:#8fe0b3;font-size:12px}.reset-btn{border-radius:8px}.light .setting-card{background:#fff}.light .select-row select{background:#fff;color:#11213a}.light .header{background:#fff}.light .theme{background:#f2f5fa;color:#11213a}.light .card{background:#fff;color:#11213a}.light .hero{background:#eaf1fb}.light .hero p{color:#62738d}.light .sidebar{background:#fff}.light .slogan{color:#11213a}footer{height:50px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:#8295ae;font-size:12px;background:#020a15}footer span{position:absolute;right:30px}@media(max-width:1000px){.file-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{padding:20px 4%}.hero-logo{width:280px}}@media(max-width:760px){.sidebar{display:none}.settings-grid{grid-template-columns:1fr}.files-heading{display:block}.search{margin-top:18px;min-width:0}.hero{display:flex;text-align:left}.hero-logo{width:42%;height:230px}.hero-copy{width:58%}.file-grid{grid-template-columns:1fr}.header{padding:0 15px}.brand-title{font-size:18px}.admin{display:none}.main{padding:14px}.settings-head{align-items:flex-start}.settings-head .reset-btn{margin-top:5px}.open{display:none}}

/* Page routing: show Home first; Settings stays hidden until explicitly clicked. */
.hero,.files-section,.settings-page{display:none!important}
.hero.page-visible{display:flex!important}.files-section.page-visible,.settings-page.page-visible{display:block!important}

/* V3 Motion Pack */
.brand{flex-direction:row;justify-content:flex-start}
.brand-copy{order:1;text-align:left}.brand .logo-box.small{order:2;margin-left:18px}
.logo-box.small img{animation:logoPulse 3.2s ease-in-out infinite;transform-origin:center}
.hero-logo .logo-box.big img{animation:logoFloat 3.8s ease-in-out infinite,logoGlow 2.8s ease-in-out infinite}
.hero:before{content:"";position:absolute;inset:-30%;background:conic-gradient(from 0deg,transparent 0 72%,rgba(246,189,34,.16) 76%,transparent 82%);animation:heroSweep 12s linear infinite;pointer-events:none}
.hero:after{content:"";position:absolute;left:-10%;right:-10%;bottom:10px;height:1px;background:linear-gradient(90deg,transparent,#f6bd22,transparent);box-shadow:0 0 18px rgba(246,189,34,.6);animation:lineTravel 4s ease-in-out infinite}
.orbit.o1{animation:orbitSpin 6s linear infinite,orbitPulse 2s ease-in-out infinite}
.orbit.o2{animation:orbitSpin2 9s linear infinite,orbitPulse 2.7s ease-in-out infinite}
.hero-copy h1{animation:titleIn .9s ease-out both}.hero-copy h2{animation:titleIn 1.1s .12s ease-out both}.hero-copy p{animation:titleIn 1.2s .2s ease-out both}.primary-btn{animation:buttonPulse 2.2s ease-in-out infinite}
.card{animation:cardIn .55s ease both}.card:nth-child(2){animation-delay:.05s}.card:nth-child(3){animation-delay:.1s}.card:nth-child(4){animation-delay:.15s}.card:nth-child(5){animation-delay:.2s}.card:nth-child(6){animation-delay:.25s}
.nav{transition:transform .25s,box-shadow .25s}.nav:hover{transform:translateX(5px);box-shadow:0 0 16px rgba(246,189,34,.12)}
@keyframes logoPulse{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.05) rotate(2deg)}}
@keyframes logoFloat{0%,100%{transform:translateY(0) rotateY(0)}50%{transform:translateY(-12px) rotateY(12deg)}}
@keyframes logoGlow{0%,100%{filter:drop-shadow(0 10px 12px rgba(0,0,0,.6)) drop-shadow(0 0 0 rgba(246,189,34,0))}50%{filter:drop-shadow(0 12px 18px rgba(0,0,0,.65)) drop-shadow(0 0 24px rgba(246,189,34,.38))}}
@keyframes orbitSpin{to{transform:rotate(348deg)}}
@keyframes orbitSpin2{to{transform:rotate(-342deg)}}
@keyframes orbitPulse{50%{opacity:.45;box-shadow:0 0 30px rgba(246,189,34,.7)}}
@keyframes heroSweep{to{transform:rotate(360deg)}}
@keyframes lineTravel{50%{opacity:.35;transform:scaleX(.35)}}
@keyframes titleIn{from{opacity:0;transform:translateX(22px)}to{opacity:1;transform:none}}
@keyframes buttonPulse{50%{box-shadow:0 0 22px rgba(246,189,34,.35)}}
@keyframes cardIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}


/* V3 EXTRA MOTION PACK - keeps the existing motion and adds more layers */
.hero{isolation:isolate}
.hero-logo{perspective:900px;z-index:2}
.hero-logo:before{content:"";position:absolute;width:250px;height:250px;border-radius:50%;border:1px solid rgba(246,189,34,.14);box-shadow:0 0 35px rgba(75,141,255,.08),inset 0 0 35px rgba(246,189,34,.05);animation:haloBreath 4.5s ease-in-out infinite}
.hero-logo:after{content:"";position:absolute;width:330px;height:330px;border-radius:50%;border:1px dashed rgba(75,141,255,.12);animation:slowRadar 16s linear infinite}
.logo-box.big{position:relative;z-index:3;animation:logoStage 5.5s ease-in-out infinite}
.logo-box.big:before{content:"";position:absolute;inset:-16px;border-radius:50%;background:radial-gradient(circle,rgba(246,189,34,.14),transparent 62%);filter:blur(5px);animation:logoAura 2.8s ease-in-out infinite;z-index:-1}
.hero-copy h1{animation:titleIn .9s ease-out both,textGlow 4s ease-in-out 1s infinite}
.hero-copy h2{animation:titleIn 1.1s .12s ease-out both,subtitleFloat 4s ease-in-out 1.2s infinite}
.gold-line{position:relative;overflow:visible}
.gold-line:after{content:"";position:absolute;top:-4px;left:-20px;width:22px;height:12px;border-radius:50%;background:rgba(255,255,255,.8);filter:blur(5px);animation:lineSpark 2.8s linear infinite}
.primary-btn{position:relative;overflow:hidden;animation:buttonPulse 2.2s ease-in-out infinite,buttonFloat 3.2s ease-in-out 1s infinite}
.primary-btn:before{content:"";position:absolute;top:-20%;bottom:-20%;left:-45%;width:28%;transform:skewX(-20deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);animation:buttonSweep 3.4s ease-in-out infinite}
.primary-btn:after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.15);animation:borderFlash 2.6s ease-in-out infinite}
.hero:global-placeholder{}
.hero .orbit.o1:before,.hero .orbit.o2:before{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 12px #f6bd22,0 0 24px rgba(246,189,34,.8);top:50%;left:-4px;transform:translateY(-50%);animation:orbitDot 6s linear infinite}
.hero .orbit.o2:before{background:#8eb8ff;box-shadow:0 0 12px #4b8dff,0 0 24px rgba(75,141,255,.8);animation-duration:9s;animation-direction:reverse}
.hero-copy:after{content:"";position:absolute;right:-35vw;top:10%;width:45vw;height:1px;background:linear-gradient(90deg,transparent,rgba(246,189,34,.28),transparent);transform:rotate(-18deg);animation:beamMove 6s ease-in-out infinite;pointer-events:none}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:20;background:linear-gradient(transparent 0%,rgba(255,255,255,.018) 50%,transparent 100%);background-size:100% 6px;opacity:.25;animation:scanlines 8s linear infinite}
body:after{content:"";position:fixed;width:280px;height:280px;right:-80px;top:12%;border-radius:50%;background:radial-gradient(circle,rgba(246,189,34,.12),transparent 68%);filter:blur(8px);pointer-events:none;animation:ambientDrift 9s ease-in-out infinite;z-index:0}
@keyframes haloBreath{0%,100%{transform:scale(.94);opacity:.55}50%{transform:scale(1.06);opacity:1}}
@keyframes slowRadar{to{transform:rotate(360deg)}}
@keyframes logoStage{0%,100%{transform:translateY(0) rotateZ(0deg) rotateY(0deg)}25%{transform:translateY(-7px) rotateZ(-2deg) rotateY(5deg)}50%{transform:translateY(-14px) rotateZ(2deg) rotateY(-7deg)}75%{transform:translateY(-5px) rotateZ(-1deg) rotateY(4deg)}}
@keyframes logoAura{0%,100%{transform:scale(.85);opacity:.25}50%{transform:scale(1.15);opacity:.75}}
@keyframes textGlow{0%,100%{text-shadow:0 0 0 rgba(246,189,34,0)}50%{text-shadow:0 0 18px rgba(246,189,34,.16)}}
@keyframes subtitleFloat{50%{transform:translateX(4px)}}
@keyframes lineSpark{from{left:-25px}to{left:100px}}
@keyframes buttonSweep{0%,20%{left:-45%}70%,100%{left:125%}}
@keyframes buttonFloat{50%{transform:translateY(-3px)}}
@keyframes borderFlash{50%{box-shadow:inset 0 0 0 1px rgba(255,255,255,.42),0 0 18px rgba(246,189,34,.16)}}
@keyframes orbitDot{to{transform:translateY(-50%) rotate(360deg)}}
@keyframes beamMove{0%,100%{opacity:.1;transform:translateX(-20%) rotate(-18deg)}50%{opacity:.7;transform:translateX(20%) rotate(-18deg)}}
@keyframes scanlines{to{background-position:0 100%}}
@keyframes ambientDrift{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-80px,45px) scale(1.25)}}
@media(max-width:760px){.hero.page-visible{display:block!important}.hero{text-align:center}.hero-logo,.hero-copy{width:100%}.hero-logo{height:190px}.hero-logo:after{width:280px;height:280px}}


/* Large Home Hero */
.hero.page-visible{min-height:430px;margin:10px 18px 24px;padding:48px 7%;border-radius:24px;border:1px solid rgba(75,141,255,.38);box-shadow:0 22px 70px rgba(0,0,0,.35),inset 0 0 60px rgba(75,141,255,.05);overflow:hidden;position:relative}
.hero-logo{width:42%;min-width:330px;height:330px;display:flex;align-items:center;justify-content:center;position:relative}
.hero-copy{width:58%;padding-left:34px;position:relative;z-index:4}
.hero-copy h1{font-size:clamp(38px,4vw,62px);line-height:1.05;margin-bottom:12px}
.hero-copy h2{font-size:28px;margin:0 0 18px}.hero-copy p{font-size:17px;max-width:620px}.primary-btn{font-size:17px;padding:14px 22px}

/* User-controlled motion modes */
body[data-motion="static"] .hero-logo img,body[data-motion="static"] .orbit,body[data-motion="static"] .hero-logo:before,body[data-motion="static"] .hero-logo:after,body[data-motion="static"] .hero:before,body[data-motion="static"] .hero:after,body[data-motion="static"] .gold-line:after,body[data-motion="static"] .hero-copy h1,body[data-motion="static"] .hero-copy h2,body[data-motion="static"] .hero-copy p,body[data-motion="static"] .primary-btn,body[data-motion="static"] .hero .orbit.o1:before,body[data-motion="static"] .hero .orbit.o2:before,body[data-motion="static"] .hero-copy:after,body[data-motion="static"]:before,body[data-motion="static"]:after{animation:none!important}
body[data-motion="soft"] .hero-logo img{animation-duration:calc(var(--motion-speed) * 1.8)!important}body[data-motion="soft"] .orbit{animation-duration:calc(var(--motion-speed) * 2)!important}
body[data-motion="orbit"] .hero-logo img{animation:logoFloat calc(var(--motion-speed) * 1.35) ease-in-out infinite!important}body[data-motion="orbit"] .orbit.o1{animation:orbitSpin var(--motion-speed) linear infinite!important}body[data-motion="orbit"] .orbit.o2{animation:orbitSpin2 calc(var(--motion-speed) * 1.4) linear infinite!important}
body[data-motion="pulse"] .hero-logo img{animation:logoPulse var(--motion-speed) ease-in-out infinite,logoGlow calc(var(--motion-speed) * .9) ease-in-out infinite!important}body[data-motion="pulse"] .orbit{animation:orbitPulse calc(var(--motion-speed) * .8) ease-in-out infinite!important}
body.motion-no-logo .hero-logo img{animation:none!important}body.motion-no-orbit .orbit,body.motion-no-orbit .hero-logo:after,body.motion-no-orbit .hero-logo:before{animation:none!important;opacity:.18!important}body.motion-no-glow .hero-logo img{filter:none!important}body.motion-no-beam .hero:before,body.motion-no-beam .hero-copy:after{animation:none!important;opacity:0!important}body.motion-no-scan:before{display:none!important}
.range-row{padding:12px 0 16px;border-top:1px solid rgba(100,130,160,.18)}.range-row span{display:flex;justify-content:space-between;margin-bottom:10px}.range-row b{color:var(--gold)}.range-row input{width:100%;accent-color:var(--gold)}

@media(max-width:900px){.hero.page-visible{min-height:auto;padding:35px 5%;display:flex!important}.hero-logo{min-width:280px;height:280px}.hero-copy{padding-left:10px}.hero-copy h1{font-size:38px}}
@media(max-width:760px){.hero.page-visible{margin:0 0 18px;padding:25px 20px}.hero-logo{height:250px;min-width:0}.hero-copy{padding-left:0}.hero-copy h1{font-size:34px}}

/* Motion speed control fix: the slider now changes the playback rate of all CSS animations. */
.range-row .range-help{display:block;margin-top:7px;color:var(--muted);font-size:11px;line-height:1.4}
.range-row input[type="range"]{cursor:pointer}


/* Sidebar logo: static glowing logo; particles travel on clean circular paths. No visible orbit lines. */
.side-logo-wrap{position:relative;width:190px;height:190px;margin:0 auto 12px;display:flex;align-items:center;justify-content:center;isolation:isolate}
.side-logo{position:relative;z-index:5;width:126px;height:126px;object-fit:contain;filter:drop-shadow(0 0 8px rgba(246,189,34,.52)) drop-shadow(0 0 18px rgba(75,141,255,.34));animation:sideLogoGlow 2.8s ease-in-out infinite}
.side-glow-ring{position:absolute;z-index:1;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(246,189,34,.14) 0%,rgba(75,141,255,.09) 43%,transparent 72%);box-shadow:0 0 30px rgba(75,141,255,.2),inset 0 0 25px rgba(246,189,34,.11);animation:sideHalo 3.2s ease-in-out infinite}
.side-particle{position:absolute;left:50%;top:50%;z-index:6;width:5px;height:5px;margin:-2.5px;border-radius:50%;background:#f6bd22;box-shadow:0 0 7px #f6bd22,0 0 15px rgba(246,189,34,.72);transform-origin:0 0;animation:sideParticleOrbit var(--orbit-speed,5.5s) linear infinite;animation-delay:var(--d,0s)}
.side-particle:nth-of-type(even){background:#4b8dff;box-shadow:0 0 7px #4b8dff,0 0 15px rgba(75,141,255,.78)}
.sp1{--a:0deg;--r:82px;--d:-.1s}.sp2{--a:30deg;--r:82px;--d:-1.0s}.sp3{--a:60deg;--r:82px;--d:-2.0s}.sp4{--a:90deg;--r:82px;--d:-3.0s}.sp5{--a:120deg;--r:82px;--d:-4.0s}.sp6{--a:150deg;--r:82px;--d:-5.0s}.sp7{--a:180deg;--r:82px;--d:-.7s}.sp8{--a:210deg;--r:82px;--d:-1.7s}.sp9{--a:240deg;--r:82px;--d:-2.7s}.sp10{--a:270deg;--r:82px;--d:-3.7s}.sp11{--a:300deg;--r:82px;--d:-4.7s}.sp12{--a:330deg;--r:82px;--d:-5.7s}
@keyframes sideLogoGlow{0%,100%{filter:drop-shadow(0 0 7px rgba(246,189,34,.42)) drop-shadow(0 0 15px rgba(75,141,255,.22))}50%{filter:drop-shadow(0 0 16px rgba(246,189,34,.78)) drop-shadow(0 0 27px rgba(75,141,255,.52))}}
@keyframes sideHalo{0%,100%{transform:scale(.94);opacity:.55}50%{transform:scale(1.08);opacity:1}}
@keyframes sideParticleOrbit{from{transform:rotate(var(--a)) translateX(var(--r)) scale(.7);opacity:.45}45%{opacity:1;transform:rotate(calc(var(--a) + 162deg)) translateX(var(--r)) scale(1.08)}100%{transform:rotate(calc(var(--a) + 360deg)) translateX(var(--r)) scale(.7);opacity:.45}}
body.motion-no-glow .side-logo{filter:none!important}
@media(max-width:760px){.side-logo-wrap{width:160px;height:160px}.side-logo{width:108px;height:108px}.side-glow-ring{width:130px;height:130px}.side-particle{--r:70px}}

/* Independent sidebar logo controller: unaffected by the main-page motion preset. */
body.side-logo-no-effect .side-logo, body.side-logo-no-effect .side-glow-ring, body.side-logo-no-effect .side-particle{animation:none!important}
body.side-logo-no-effect .side-logo{filter:none!important}
body.side-logo-no-effect .side-glow-ring{opacity:0!important;box-shadow:none!important}
body.side-logo-no-effect .side-particle{opacity:0!important}

/* Additional independent home-element motion controls. */
body.motion-no-view-files .primary-btn,
body.motion-no-view-files .primary-btn::before,
body.motion-no-view-files .primary-btn::after{animation:none!important;transform:none!important;}
body.motion-no-underline .gold-line::after{animation:none!important;opacity:0!important;}
body.motion-no-underline .gold-line{box-shadow:none!important;}


/* Orbit line visibility controller. The logo and its motion remain active; only the visible lines are hidden. */
body.motion-no-orbit-lines .hero .orbit{border-color:transparent!important;box-shadow:none!important;}
body.motion-no-orbit-lines .hero .orbit::before{opacity:0!important;}
body.motion-no-orbit-lines .hero-logo:before,
body.motion-no-orbit-lines .hero-logo:after{border-color:transparent!important;box-shadow:none!important;}

/* Light mode visibility upgrade: dark mode rules above remain unchanged. */
body.light{
  --bg:#eef4fb;--panel:#ffffff;--text:#10264a;--muted:#526987;--line:#c7d9ee;
  background:linear-gradient(135deg,#edf5ff 0%,#f8fbff 48%,#fff8e8 100%)!important;
}
body.light .header{background:rgba(255,255,255,.96);border-bottom:1px solid #c7d9ee;box-shadow:0 4px 18px rgba(23,63,105,.08)}
body.light .brand-title{color:#0b2b57;text-shadow:none}
body.light .brand-sub{color:#4d78a8}
body.light .sidebar{background:linear-gradient(180deg,#ffffff 0%,#f4f8fd 100%);border-right:1px solid #c7d9ee;box-shadow:5px 0 22px rgba(31,72,118,.06)}
body.light .nav{color:#173967}
body.light .nav:hover{background:#eaf3ff;color:#0a3b73;box-shadow:0 7px 18px rgba(50,116,190,.12)}
body.light .nav.active{background:linear-gradient(90deg,#e0a816,#ffc52e);color:#071a32;box-shadow:0 8px 20px rgba(212,159,22,.22)}
body.light .theme{background:#fff;color:#15365d;border-color:#9db9d8;box-shadow:0 4px 12px rgba(35,80,125,.08)}
body.light .admin{color:#173967}
body.light .hero.page-visible{background:linear-gradient(135deg,#e5f1ff 0%,#ffffff 52%,#fff8df 100%);border-color:#9bc8ff;box-shadow:0 22px 55px rgba(35,78,120,.18),inset 0 0 60px rgba(62,139,220,.08)}
body.light .hero-copy h1{color:#092b57}
body.light .hero-copy h1 span{color:#f2ae12}
body.light .hero-copy h2{color:#3974b6}
body.light .hero-copy p{color:#405d7f}
body.light .gold-line{background:#f5b817;box-shadow:0 0 12px rgba(245,184,23,.35)}
body.light .primary-btn{background:linear-gradient(135deg,#ffca28,#f4ad12);color:#071a32;box-shadow:0 10px 24px rgba(220,157,12,.25)}
body.light .primary-btn:hover{box-shadow:0 14px 30px rgba(220,157,12,.34)}
body.light .side-brand{color:#12345d}
body.light .slogan{color:#12345d!important}
body.light .slogan em{color:#d99d00!important}
body.light .files-heading h2{color:#102e58}
body.light .files-heading h2 span{color:#d99d00}
body.light .files-heading p,body.light .status{color:#526987}
body.light .search{background:#fff;border-color:#b9d2ec;box-shadow:0 5px 16px rgba(43,88,134,.08)}
body.light .search input{color:#173967}
body.light .search input::placeholder{color:#7890ab}
body.light .card{background:linear-gradient(145deg,#fff,#f5faff);border-color:#c7def5;box-shadow:0 9px 24px rgba(36,84,130,.10)}
body.light .card:hover{border-color:#8cbdf1;box-shadow:0 14px 30px rgba(36,84,130,.16)}
body.light .file-name{color:#153967}
body.light .file-meta{color:#6b819c}
body.light .open{color:#d89d00}
body.light .settings-page h2{color:#102e58}
body.light .settings-page p{color:#526987}
body.light .setting-card{background:linear-gradient(145deg,#ffffff,#f7fbff);border-color:#c5dbee;box-shadow:0 10px 24px rgba(36,84,130,.08)}
body.light .setting-card h3{color:#14345f}
body.light .setting-row,.light .select-row{border-color:#dce7f2}
body.light .setting-row strong,body.light .select-row span{color:#173967}
body.light .setting-row small,.light .range-help{color:#6b819c}
body.light .setting-row i{background:#b9cbe0}
body.light .switch:checked+i{background:#1785ee;box-shadow:0 0 0 3px rgba(23,133,238,.10)}
body.light .switch:checked+i:after{background:#fff}
body.light .select-row select{background:#fff;color:#173967;border-color:#a9c5e2}
body.light .action-btn{background:#edf6ff;color:#12467f;border-color:#a9c9e8}
body.light .reset-btn{background:#fff;color:#173967;border-color:#a9c5e8}
body.light footer{background:#f6f9fd;color:#5d7490;border-color:#c7d9ee}
body.light .orbit{filter:drop-shadow(0 0 4px rgba(245,184,23,.32))}
body.light .hero-logo:before{border-color:rgba(245,184,23,.22);box-shadow:0 0 35px rgba(23,133,238,.10),inset 0 0 35px rgba(245,184,23,.08)}
body.light .hero-logo:after{border-color:rgba(23,133,238,.18)}

/* V3 Theme Studio - additional dark and light palettes. Dark mode behavior is preserved; themes only recolor surfaces, accents and readable text. */
body.theme-midnight:not(.light){--bg:#020713;--panel:#071226;--text:#f4f7ff;--muted:#9fb0c9;--line:#20395f;--gold:#62a7ff;--blue:#4b7dff}
body.theme-ocean:not(.light){--bg:#02121a;--panel:#062430;--text:#effcff;--muted:#9cc3cd;--line:#1b5365;--gold:#22c7d8;--blue:#36a5ff}
body.theme-emerald:not(.light){--bg:#03130f;--panel:#07231b;--text:#effff7;--muted:#9bc3b3;--line:#1e5845;--gold:#4fd18b;--blue:#39a7ff}
body.theme-purple:not(.light){--bg:#0d0618;--panel:#1b0d2c;--text:#faf5ff;--muted:#c0acd2;--line:#4a2d68;--gold:#c88cff;--blue:#6f8cff}
body.theme-crimson:not(.light){--bg:#160608;--panel:#260b10;--text:#fff5f6;--muted:#d2aeb3;--line:#64202b;--gold:#ffb02e;--blue:#ff5577}
body.theme-slate:not(.light){--bg:#0b1017;--panel:#151c26;--text:#f2f5f8;--muted:#aab5c3;--line:#344454;--gold:#e6b85c;--blue:#79a9d8}
body.theme-carbon:not(.light){--bg:#050505;--panel:#101010;--text:#f7f3e9;--muted:#b8b1a2;--line:#3c3528;--gold:#d9a92e;--blue:#7aa7c7}
body.theme-arctic.light{--bg:#eef7ff;--panel:#ffffff;--text:#09284b;--muted:#52708f;--line:#bcdcf5;--gold:#e7a900;--blue:#1685df}
body.theme-sky.light{--bg:#edf8ff;--panel:#ffffff;--text:#07305b;--muted:#4d6f91;--line:#b7def7;--gold:#f0aa16;--blue:#168ee8}
body.theme-pearl.light{--bg:#fbfaf6;--panel:#ffffff;--text:#18263a;--muted:#687487;--line:#e5dcc7;--gold:#b67b00;--blue:#4d7fae}
body.theme-mint.light{--bg:#effaf6;--panel:#ffffff;--text:#12352d;--muted:#5c7b73;--line:#c6e8df;--gold:#c28b13;--blue:#159a86}
body.theme-lavender.light{--bg:#f7f3ff;--panel:#ffffff;--text:#28204a;--muted:#6f6787;--line:#ddd2f5;--gold:#b77a00;--blue:#735bd6}
body.theme-sand.light{--bg:#fff8ed;--panel:#fffdf8;--text:#392918;--muted:#7a6752;--line:#ead8bd;--gold:#c78912;--blue:#4e82ad}
/* Light mode readability improvements for every palette. */
body.light .brand-title,body.light .hero h1,body.light .files-heading h2,body.light .settings-page h2{color:var(--text)}
body.light .brand-sub,body.light .hero h2,body.light .hero p,body.light .files-heading p,body.light .settings-page p{color:var(--muted)}
body.light .hero{background:linear-gradient(115deg,var(--panel),var(--bg));box-shadow:0 16px 40px rgba(25,65,100,.14)}
body.light .sidebar{background:rgba(255,255,255,.94);border-right-color:var(--line)}
body.light .nav{color:var(--muted)}
body.light .nav.active{background:linear-gradient(90deg,var(--gold),#ffd76b);color:#142238;box-shadow:0 8px 20px rgba(50,90,130,.14)}
body.light .setting-card{background:var(--panel);border-color:var(--line);box-shadow:0 8px 22px rgba(35,70,110,.08)}
body.light .card{background:var(--panel);border-color:var(--line);box-shadow:0 6px 18px rgba(35,70,110,.06)}
body.light .search{background:var(--panel);border-color:var(--line)}
body.light .search input{color:var(--text)}
body.light .select-row select{border-color:var(--line);background:var(--panel);color:var(--text)}
body.light .theme{background:var(--panel);border-color:var(--line);color:var(--text)}
body.light .primary-btn{box-shadow:0 8px 20px rgba(230,169,0,.24)}
body.light footer{background:var(--panel);color:var(--muted)}

/* Floating movement controller fix: disabling Logo Float now stops BOTH the main logo and Text Server floating motion. */
body.motion-no-logo .logo-box.big,
body.motion-no-logo .hero-logo img,
body.motion-no-logo .hero-copy h2{
  animation:none!important;
  transform:none!important;
}
/* Keep the initial entrance effect off as well when the user disables floating motion. */
body.motion-no-logo .hero-copy h2{
  opacity:1!important;
}

/* V3 file management controls */
.file-toolbar{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap}
.server-btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:10px;padding:10px 15px;font-weight:800;cursor:pointer;color:var(--text);background:var(--panel);box-shadow:0 6px 18px rgba(0,0,0,.12);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.server-btn:hover{transform:translateY(-2px);border-color:var(--blue);box-shadow:0 9px 22px rgba(0,0,0,.18)}
.upload-btn{color:var(--blue)}
.file-card{display:flex!important;align-items:center;gap:14px}
.file-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-left:auto;flex-wrap:wrap}
.file-action{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:7px 11px;border-radius:9px;border:1px solid var(--line);background:var(--panel);color:var(--text);text-decoration:none;font-size:12px;font-weight:800;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.file-action:hover{transform:translateY(-2px);box-shadow:0 7px 16px rgba(0,0,0,.18);border-color:var(--blue)}
.file-action.open{color:var(--gold)}
@media(max-width:900px){.file-card{align-items:flex-start;flex-wrap:wrap}.file-actions{width:100%;margin-left:0;justify-content:flex-start}}
@media(max-width:700px){.file-toolbar{justify-content:flex-start}.file-card{display:block!important}.file-actions{margin-top:12px}}

/* V3 requested controls: preserve existing colours */
.upload-btn{position:relative;overflow:hidden;isolation:isolate}
.upload-btn::after{
 content:"";position:absolute;top:-35%;left:-45%;width:22%;height:170%;
 background:linear-gradient(90deg,transparent,rgba(255,255,255,.92),transparent);
 transform:skewX(-18deg);pointer-events:none;z-index:2;
 animation:v3UploadShine 2.4s linear infinite;
}
@keyframes v3UploadShine{
 0%{left:-45%}
 100%{left:125%}
}
body.upload-strip-disabled .upload-btn::after{animation:none!important;opacity:0!important}
.upload-btn:disabled{cursor:not-allowed;opacity:.5}
.server-btn.upload-control-btn,.server-btn.strip-control-btn{white-space:nowrap}
@media(max-width:1100px){
 .file-toolbar{gap:8px}
 .server-btn{padding:9px 12px}
}

/* Settings-only upload controls */
.settings-control-row .server-btn{
  font:inherit;
}


/* V3 Logout control */
.logout-btn{border:1px solid rgba(246,189,34,.45);background:linear-gradient(135deg,rgba(246,189,34,.16),rgba(75,141,255,.10));color:var(--text);border-radius:10px;padding:10px 14px;font-weight:800;cursor:pointer;transition:.2s ease;box-shadow:0 6px 18px rgba(0,0,0,.14)}
.logout-btn:hover{transform:translateY(-1px);border-color:rgba(246,189,34,.8);box-shadow:0 9px 22px rgba(0,0,0,.2)}
body.light .logout-btn{background:linear-gradient(135deg,#fff7df,#edf6ff);color:#173967;border-color:#d5aa32;box-shadow:0 5px 14px rgba(35,80,125,.08)}
@media(max-width:760px){.header-right{gap:6px}.logout-btn{padding:9px 10px}.logout-btn{font-size:12px}.admin{display:none}}

/* Login/Logout branding: use the exact sidebar logo and its particle/glow motion. */
.login-side-logo{width:190px;height:190px;margin:4px auto 8px}
.login-side-logo .side-logo{width:126px;height:126px}
@media(max-width:760px){.login-side-logo{width:160px;height:160px}.login-side-logo .side-logo{width:108px;height:108px}}

/* Cosmic Login/Logout logo motion: shooting stars, impact bursts and orbiting particles. */
.cosmic-logo{overflow:visible!important;isolation:isolate;}
.cosmic-logo .cosmic-canvas{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:100%;height:100%;pointer-events:none;z-index:0;overflow:visible}
.cosmic-logo .side-glow-ring,.cosmic-logo .side-logo,.cosmic-logo .side-particle{z-index:2}
.cosmic-logo .side-logo{animation:sideLogoGlow 2.6s ease-in-out infinite, cosmicLogoPulse 3.4s ease-in-out infinite!important}
.cosmic-logo .side-glow-ring{animation:sideHalo 3s ease-in-out infinite!important}
@keyframes cosmicLogoPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
.cosmic-logo .side-particle{animation:sideParticleOrbit 5.5s linear infinite, cosmicParticleSpark 1.7s ease-in-out infinite!important}
@keyframes cosmicParticleSpark{0%,100%{filter:brightness(.8)}50%{filter:brightness(1.8);transform-origin:center}}
.cosmic-page{position:relative;overflow:hidden}
.cosmic-page:before,.cosmic-page:after{content:"";position:fixed;inset:-30%;pointer-events:none;z-index:-1}
.cosmic-page:before{background:radial-gradient(circle at 50% 35%,rgba(22,72,130,.18),transparent 34%),radial-gradient(circle at 20% 80%,rgba(246,189,34,.07),transparent 22%);animation:cosmicNebula 12s ease-in-out infinite alternate}
.cosmic-page:after{background-image:radial-gradient(circle,rgba(255,255,255,.55) 0 1px,transparent 1.5px);background-size:90px 90px;opacity:.16;animation:starDrift 22s linear infinite}
@keyframes cosmicNebula{to{transform:scale(1.08) rotate(2deg);opacity:.9}}
@keyframes starDrift{to{transform:translate3d(70px,40px,0)}}
@media(prefers-reduced-motion:reduce){.cosmic-logo .side-logo,.cosmic-logo .side-glow-ring,.cosmic-logo .side-particle,.cosmic-page:before,.cosmic-page:after{animation:none!important}}

/* V3 auth pages: static typography/buttons; motion stays around the logo/cosmos. */
.auth-page .auth-title,
.auth-page .auth-title span,
.auth-page .auth-server-line,
.auth-page .auth-server-line span,
.auth-page form,
.auth-page form label,
.auth-page form button,
.auth-page .primary-btn,
.auth-page p,
.auth-page a.primary-btn {
  animation: none !important;
  transform: none !important;
}
.auth-page .auth-title span { color: var(--gold) !important; }
.auth-page .auth-server-line {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  margin:0 0 20px;
  color:var(--gold);
  font-size:22px;
  font-weight:800;
  line-height:1;
  white-space:nowrap;
}
.auth-page .auth-server-line::before,
.auth-page .auth-server-line::after {
  content:"";
  height:2px;
  flex:1;
  max-width:150px;
  background:var(--gold);
  box-shadow:0 0 7px rgba(246,189,34,.35);
  animation:none !important;
  transform:none !important;
}
.auth-page .primary-btn::before,
.auth-page .primary-btn::after,
.auth-page .logout-btn::before,
.auth-page .logout-btn::after {
  animation:none !important;
  transform:none !important;
  opacity:0 !important;
}
/* No zoom/pulse on the Login/Logout logo or its halo. */
.auth-page .cosmic-logo .side-logo {
  /* Same glowing treatment as the sidebar logo, but absolutely no zoom/scale. */
  animation: sideLogoGlow 2.8s ease-in-out infinite !important;
  transform: none !important;
}
.auth-page .cosmic-logo .side-glow-ring {
  /* Keep the surrounding halo glowing without changing the logo size. */
  animation: sideHalo 3.2s ease-in-out infinite !important;
}
.auth-page .cosmic-logo .side-particle {
  animation: sideParticleOrbit 5.5s linear infinite, cosmicParticleSpark 1.7s ease-in-out infinite !important;
}
@media(max-width:760px){
  .auth-page .auth-server-line { font-size:19px; gap:12px; }
  .auth-page .auth-server-line::before,
  .auth-page .auth-server-line::after { max-width:90px; }
}


/* V3 branding: V3 and Text Server are gold on all V3 pages. */
.brand-title .brand-v3,
.auth-title .brand-v3 { color:var(--gold)!important; }
.brand-sub { color:var(--gold)!important; font-weight:700; }

/* Auth branding: long gold divider with Text Server centered. */
.auth-page .auth-server-line { color:var(--gold)!important; }
.auth-page .auth-server-line::before,
.auth-page .auth-server-line::after { background:var(--gold)!important; box-shadow:0 0 9px rgba(246,189,34,.45)!important; }

/* Keep all auth text and controls static; only the logo-area effects animate. */
.auth-page .auth-title,
.auth-page .auth-title *,
.auth-page .auth-server-line,
.auth-page form,
.auth-page form *,
.auth-page .primary-btn,
.auth-page p,
.auth-page a.primary-btn { animation:none!important; transform:none!important; }
.auth-page .cosmic-logo .side-logo { animation:sideLogoGlow 2.6s ease-in-out infinite!important; transform:none!important; }

/* Header branding: center Text Server beneath the company name with long gold divider lines. */
.header .brand > div:last-child { min-width: 320px; }
.header .brand-title { white-space: nowrap; text-align: center; }
.header .brand-sub { display:flex; align-items:center; justify-content:center; gap:12px; color:var(--gold)!important; font-weight:700; margin-top:4px; white-space:nowrap; }
.header .brand-sub::before,
.header .brand-sub::after { content:""; height:2px; background:var(--gold); flex:1 1 auto; min-width:55px; max-width:180px; border-radius:4px; box-shadow:0 0 8px rgba(246,189,34,.35); }
@media(max-width:760px){
  .header .brand > div:last-child { min-width:0; max-width:calc(100vw - 150px); }
  .header .brand-title { font-size:18px; }
  .header .brand-sub { font-size:13px; gap:7px; }
  .header .brand-sub::before,.header .brand-sub::after { min-width:18px; }
}


/* FINAL HEADER BRANDING: centered Text Server with long gold divider lines */
.header .brand > div:last-child{
  flex:0 1 560px;
  min-width:320px;
}
.header .brand-title{
  text-align:center;
  color:#f6bd22!important;
  font-weight:800;
  line-height:1.15;
}
.header .brand-title .brand-v3{color:#f6bd22!important;}
.header .brand-sub{
  display:flex!important;
  align-items:center;
  justify-content:center;
  gap:14px;
  width:100%;
  margin-top:7px;
  color:#f6bd22!important;
  font-weight:800;
  text-align:center;
  white-space:nowrap;
}
.header .brand-sub::before,
.header .brand-sub::after{
  content:"";
  height:2px;
  flex:1 1 auto;
  min-width:80px;
  background:#f6bd22;
  border-radius:3px;
  box-shadow:0 0 8px rgba(246,189,34,.4);
}
@media(max-width:760px){
  .header .brand > div:last-child{flex:1 1 auto;min-width:0;max-width:none;}
  .header .brand-title{font-size:18px;}
  .header .brand-sub{font-size:14px;gap:8px;}
  .header .brand-sub::before,.header .brand-sub::after{min-width:20px;}
}


/* FINAL BRAND COLOR FIX: only V3 is gold; -Outsourcing Solutions is white. */
.header .brand-title { color:#f3f6fc!important; }
.header .brand-title .brand-v3 { color:#f6bd22!important; }
.auth-page .auth-title { color:#f3f6fc!important; }
.auth-page .auth-title .brand-v3 { color:#f6bd22!important; }