:root{--sidebar:238px;--topbar:68px;--bg:#061221;--surface:#0a1b2d;--surface2:#0d2238;--line:#173451;--text:#f4f8ff;--muted:#86a1c1;--blue:#1597ff;--cyan:#21c8ff}
body{background:radial-gradient(circle at 75% -25%,#11345d 0,transparent 34%),linear-gradient(135deg,#06111f,#07192b 55%,#05101c)}
.app-shell{padding-left:var(--sidebar)}
.sidebar{position:fixed;inset:0 auto 0 0;z-index:45;width:var(--sidebar);display:flex;flex-direction:column;border-right:1px solid #15314d;background:linear-gradient(180deg,#071b2e 0%,#061322 100%);box-shadow:20px 0 55px #01081244}
.sidebar>.brand{height:var(--topbar);padding:0 24px;border-bottom:1px solid #15314d;gap:11px}
.sidebar>.brand>span:last-child{display:grid;line-height:1.05}
.sidebar>.brand b{font-size:18px;letter-spacing:.02em}.sidebar>.brand small{margin-top:5px;color:#7290b2;font-size:8px;letter-spacing:.15em}
.brand-mark{width:34px;height:34px;border-radius:9px;color:white;font-size:15px;background:linear-gradient(145deg,#17c2ff,#1264ff);box-shadow:0 8px 25px #138dff44}
.sidebar .nav{height:auto;display:grid;align-content:start;gap:6px;margin:18px 12px;overflow:auto}
.sidebar .nav a{min-height:48px;padding:0 15px;border:1px solid transparent;border-radius:10px;border-bottom:1px solid transparent;gap:13px}
.sidebar .nav a i{width:24px;color:#92b1d4;font-size:19px;font-style:normal;text-align:center}
.sidebar .nav a:hover,.sidebar .nav a.active{border-color:#0d66ad;background:linear-gradient(90deg,#0d3961,#0b2a49);color:#39adff}
.sidebar .nav a.active i{color:#28a8ff}
.feedback-side{margin:auto 14px 18px;padding:12px 14px;border:1px solid #75404a;border-radius:10px;background:#261722;color:#ffb2be;font-weight:800;cursor:pointer}
.feedback-side:hover{background:#3a1b29;border-color:#ff657e}
.topbar{left:var(--sidebar);height:var(--topbar);padding:0 28px;border-bottom-color:#15314d;background:#071524e8}
.global-search{width:min(620px,45vw);height:42px;display:flex;align-items:center;gap:10px;padding:0 15px;border:1px solid #1b3a59;border-radius:10px;background:#0b2035;color:#7291b4}
.global-search input{width:100%;border:0;outline:0;background:transparent;color:#dceaff}.global-search input::placeholder{color:#708baa}
.notification{position:relative}.notification b{position:absolute;right:-3px;top:-5px;min-width:17px;height:17px;display:grid;place-items:center;border:2px solid #081625;border-radius:10px;background:#ff4862;color:white;font-size:9px}
main{max-width:none;margin:0;padding:30px 30px 100px}
.page-head{padding-bottom:3px}.page-head h1{font-size:36px;letter-spacing:-.025em}
.panel,.metric,.project-card,.task-column{box-shadow:0 15px 45px #0108132b}.panel{background:linear-gradient(145deg,#0b2035,#081728)}
.metric{min-height:118px;padding:22px;background:linear-gradient(145deg,#0d263d,#09192a)}.metric strong{font-size:38px}
.project-card{min-height:92px;background:linear-gradient(90deg,#0c2035,#091827)}.task-card{background:linear-gradient(145deg,#122a44,#0c1d31)}
.calendar-grid{background:#071a2b}.cal-cell{min-height:82px;background:linear-gradient(180deg,#091c2f,#071827)}.cal-event{box-shadow:0 7px 20px #0005}
.login-screen{position:relative;isolation:isolate;min-height:100vh;grid-template-columns:1fr;place-items:center;padding:40px;background:radial-gradient(circle at 50% 40%,#10365eaa,transparent 35%),linear-gradient(120deg,#030b14,#071a2d 55%,#02070d)}
.login-screen:before{content:"";position:absolute;inset:0;z-index:-3;background:linear-gradient(90deg,#020812dd,#06111f77,#020812dd),repeating-linear-gradient(90deg,transparent 0 159px,#138ee90b 160px),repeating-linear-gradient(0deg,transparent 0 89px,#138ee90a 90px)}
.login-art{position:absolute;inset:0;z-index:-2;min-height:0;border:0;border-radius:0;background:transparent;overflow:hidden}
.studio-camera{position:absolute;left:6%;top:24%;width:260px;height:180px;display:grid;place-items:center;border:1px solid #1e4f7a;border-radius:35px;background:linear-gradient(145deg,#0d2439,#06101d);color:#168fff;font-size:70px;transform:rotate(-7deg);box-shadow:0 30px 100px #000a}
.studio-camera:before{content:"";position:absolute;right:-85px;width:85px;height:105px;clip-path:polygon(0 23%,100% 0,100% 100%,0 77%);background:#0b2844;border:1px solid #1e4f7a}
.studio-screen{position:absolute;right:4%;bottom:12%;width:31%;height:35%;display:flex;align-items:end;gap:12px;padding:30px;border:1px solid #1f4b73;border-radius:20px;background:linear-gradient(145deg,#0c263f,#061422);box-shadow:0 35px 100px #000a;transform:perspective(800px) rotateY(-8deg)}
.studio-screen span{flex:1;border-radius:7px 7px 0 0;background:linear-gradient(#27c7ff,#126bff);box-shadow:0 0 30px #158cff55}.studio-screen span:nth-child(1){height:40%}.studio-screen span:nth-child(2){height:76%}.studio-screen span:nth-child(3){height:58%}
.studio-line{position:absolute;height:2px;background:linear-gradient(90deg,transparent,#158fff,transparent);filter:drop-shadow(0 0 8px #1597ff)}.line-a{left:0;right:0;top:18%;transform:rotate(5deg)}.line-b{left:15%;right:0;bottom:18%;transform:rotate(-4deg)}
.login-card{width:min(530px,calc(100vw - 32px));padding:45px 58px;border:1px solid #315a82;border-radius:26px;background:linear-gradient(145deg,#0b1c2edf,#071321f2);box-shadow:0 35px 100px #000c;backdrop-filter:blur(22px)}
.brand-login{justify-content:center;font-size:28px}.brand-login .brand-mark{width:48px;height:48px;font-size:19px}.login-subtitle{text-align:center;color:#8da5c1;margin-top:12px}
.login-card h1{margin:36px 0 8px;text-align:center}.login-card>p{text-align:center}.login-card input{height:56px;background:#091725cc;border-color:#2a4664}.login-card .primary{height:56px;font-size:17px;background:linear-gradient(105deg,#28adff,#1262ff)}
@media(max-width:1100px){.app-shell{padding-left:0}.sidebar{width:270px;transform:translateX(-100%);transition:.2s}.sidebar:has(.nav.open){transform:translateX(0)}.topbar{left:0}.sidebar .nav{position:static;width:auto;display:grid;padding:0;background:transparent;border:0}.global-search{width:min(480px,50vw)}}
@media(max-width:700px){.login-screen{padding:16px}.login-card{padding:32px 24px}.studio-camera{left:-100px;opacity:.45}.studio-screen{right:-100px;width:70%;opacity:.35}.global-search{display:none}.topbar{padding:0 12px}.sidebar>.brand span:last-child{display:grid}.feedback-side{display:block}.feedback-fab{display:grid!important;place-items:center}.page-head h1{font-size:30px}}