body.auth-locked{overflow:hidden;background:#111214}body.auth-locked>aside,body.auth-locked>main,body.auth-locked>#modal,body.auth-locked>.cloud-status{visibility:hidden;pointer-events:none}
.auth-shell[hidden]{display:none}.auth-shell{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;overflow:auto;background:radial-gradient(ellipse at 72% 18%,#34363b66,transparent 48%),radial-gradient(ellipse at 12% 86%,#25282d,transparent 52%),#101113;color:#efefef;padding:48px 24px;font-family:inherit}
.auth-card{position:relative;width:min(100%,450px);z-index:2;padding:42px 44px;background:linear-gradient(145deg,#242529da,#161719ee);border:1px solid #ffffff16;border-radius:24px;box-shadow:0 32px 110px #0008,inset 0 1px #ffffff09;backdrop-filter:blur(24px);animation:auth-enter .8s ease both}
.auth-brand{display:flex;align-items:center;gap:14px;font-size:12px;font-weight:600;letter-spacing:2.5px;margin-bottom:44px}.auth-brand small{font-size:9px;letter-spacing:4px;color:#8e9098}.auth-mark{font-size:38px;line-height:1;letter-spacing:-5px;font-weight:700}.auth-mark span{color:#bca886}.auth-kicker{color:#999ca4;letter-spacing:2px;font-size:9px;margin-bottom:18px}.auth-card h1{font-size:33px;line-height:1.2;letter-spacing:-1.1px;font-weight:500;margin:0}.auth-card h1 span{color:#bca886}.auth-intro{font-size:13px;line-height:1.7;color:#94969e;margin:18px 0 30px}.auth-card form>label{display:block;font-size:11px;font-weight:500;color:#b3b5bc;margin-bottom:18px}.auth-card input:not([type=checkbox]){display:block;width:100%;height:48px;background:#10111399;border:1px solid #ffffff17;color:#f2f2f2;border-radius:10px;margin-top:9px;padding:0 14px;font:inherit;font-size:14px;transition:border-color .3s,box-shadow .3s}.auth-card input::placeholder{color:#60636b}.auth-card input:focus{outline:none;border-color:#bca88688;box-shadow:0 0 0 3px #bca88615}.auth-password{display:block;position:relative}.auth-password input{padding-right:76px!important}.auth-password button{position:absolute;right:12px;top:0;height:48px;font-size:10px;color:#a7a9b0}.auth-card .auth-remember{display:flex;gap:9px;align-items:center;font-size:11px;color:#9699a1;font-weight:400;margin:20px 0 24px}.auth-remember input{accent-color:#bca886;width:15px;height:15px;margin:0}.auth-submit{width:100%;height:49px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;background:#e3ddd2;color:#202124;border-radius:10px;font-weight:600;font-size:12px;transition:background .4s,transform .4s,box-shadow .4s}.auth-submit:hover{background:#f3eee5;box-shadow:0 6px 24px #e3ddd217;transform:translateY(-1px)}.auth-submit:disabled{opacity:.6;cursor:wait}.auth-submit span{font-size:20px}.auth-foot{display:flex;align-items:center;justify-content:center;gap:8px;font-size:10px;color:#777b83;margin-top:22px}.auth-light{width:4px;height:4px;border-radius:50%;background:#bca886}.auth-card #auth-message{font-size:12px;line-height:1.6;color:#e9bb9a;margin:12px 0 0;min-height:0}.auth-copyright{position:fixed;bottom:22px;font-size:9px;letter-spacing:3px;color:#595d66}.auth-orbit{position:absolute;width:780px;height:780px;border:1px solid #ffffff06;border-radius:50%;pointer-events:none;transform:translate(30%,10%)}.auth-orbit:before{content:'';position:absolute;inset:65px;border:1px solid #ffffff05;border-radius:50%}.star-field{position:absolute;inset:0;overflow:hidden;pointer-events:none;background-image:radial-gradient(1px 1px at 12% 23%,#ffffff77,transparent),radial-gradient(1px 1px at 83% 15%,#ffffff55,transparent),radial-gradient(1px 1px at 70% 78%,#ffffff66,transparent),radial-gradient(1px 1px at 28% 72%,#ffffff55,transparent);background-size:570px 490px}.star-field i{position:absolute;left:calc(-20% + var(--i)*19%);top:-15%;width:140px;height:1px;background:linear-gradient(90deg,transparent,#d8dae3aa);opacity:0;transform:rotate(42deg);animation:falling-star 11s linear infinite;animation-delay:calc(var(--i)*-2.6s)}
@keyframes falling-star{0%,50%{opacity:0;transform:translate(0,0) rotate(42deg)}54%{opacity:.7}66%{opacity:0;transform:translate(700px,650px) rotate(42deg)}100%{opacity:0;transform:translate(700px,650px) rotate(42deg)}}@keyframes auth-enter{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
.cloud-status{position:fixed;bottom:10px;right:20px;z-index:30;border:1px solid #deded6;border-radius:16px;background:#fffffff0;padding:6px 12px;font-size:11px;color:#607966;max-width:min(90vw,540px)}.cloud-status.cloud-error{color:#9b6033}
@media(max-width:520px){.auth-shell{padding:24px 16px 50px}.auth-card{padding:30px 26px;border-radius:20px}.auth-brand{margin-bottom:30px}.auth-card h1{font-size:29px}.auth-copyright{font-size:8px;bottom:15px}}
@media(prefers-reduced-motion:reduce){.star-field i,.auth-card{animation:none!important}.auth-submit{transition:none}}
.auth-shell{align-items:safe center}
@media(max-height:800px){.auth-card{padding-top:28px;padding-bottom:28px}.auth-brand{margin-bottom:26px}.auth-intro{margin:14px 0 22px}.auth-shell{padding-top:28px;padding-bottom:44px}}

/* Deep graphite space, with staggered meteor trails behind the form. */
.auth-shell{background:radial-gradient(ellipse at 18% 30%,#252b4360,transparent 52%),radial-gradient(ellipse at 84% 70%,#35304350,transparent 48%),#07090f;isolation:isolate}
.auth-card{background:linear-gradient(145deg,#20232ce8,#11141ce8);box-shadow:0 32px 110px #0009,inset 0 1px #ffffff0c;border-color:#d7dfff20}
.auth-brand{gap:18px;margin-bottom:30px}.auth-logo{display:block;width:72px;height:72px;object-fit:contain;border-radius:10px;box-shadow:0 8px 28px #0006}
.auth-nebula{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 72% 20%,#6977971f,transparent 32%),radial-gradient(ellipse at 24% 76%,#5d486f20,transparent 36%);z-index:0}
.star-field{z-index:1;background:none}
.star-field .distant-star{position:absolute;display:block;width:var(--size);height:var(--size);background:#e5ecff;border-radius:50%;box-shadow:0 0 5px #c5d7ff60;opacity:.5;animation:star-shimmer 7s ease-in-out infinite;animation-delay:var(--delay)}
.star-field i.shooting-star{left:var(--x);top:var(--y);width:clamp(70px,12vw,180px);height:1px;opacity:0;background:linear-gradient(90deg,transparent,#c8dcff55 65%,#f1f6ff);box-shadow:0 0 5px #b5d0ff30;animation:space-meteor var(--duration) linear infinite;animation-delay:var(--delay);transform:rotate(38deg);will-change:transform,opacity}
@keyframes space-meteor{0%{opacity:0;transform:translate3d(-12vw,-10vh,0) rotate(38deg)}7%{opacity:.85}29%{opacity:.65}38%,100%{opacity:0;transform:translate3d(70vw,65vh,0) rotate(38deg)}}
@keyframes star-shimmer{0%,100%{opacity:.25}50%{opacity:.85}}
@media(max-width:520px){.auth-logo{width:60px;height:60px}.star-field i.shooting-star:nth-child(n+15){display:none}}
@media(prefers-reduced-motion:reduce){.star-field i.shooting-star{display:none}.star-field .distant-star{animation:none;opacity:.55}}

/* One entrance sequence, only after successful authentication. */
.auth-shell.auth-departing{pointer-events:none;animation:space-door-open 1s cubic-bezier(.22,1,.36,1) both}
.auth-departing .auth-card{animation:login-card-depart .75s cubic-bezier(.22,1,.36,1) both}
body.workspace-entering{overflow:hidden}
.workspace-entering>aside{animation:workspace-panel-in 1.15s cubic-bezier(.22,1,.36,1) .25s both}
.workspace-entering>main{animation:workspace-panel-in 1.3s cubic-bezier(.22,1,.36,1) .38s both}
.workspace-entering #nav>button{animation:workspace-item-in .9s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(.48s + var(--entry,0)*.055s)}
.workspace-entering #content>*{animation:workspace-item-in 1.05s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(.62s + var(--entry,0)*.085s)}
.workspace-entering .cloud-status{animation:workspace-item-in .8s ease 1.1s both}
@keyframes space-door-open{0%{opacity:1}55%{opacity:.5}100%{opacity:0}}
@keyframes login-card-depart{from{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}to{opacity:0;transform:translateY(-18px) scale(1.035);filter:blur(5px)}}
@keyframes workspace-panel-in{from{opacity:0;transform:translateY(12px) scale(.992)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes workspace-item-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.workspace-entering #nav>button:nth-child(1),.workspace-entering #content>:nth-child(1){--entry:0}
.workspace-entering #nav>button:nth-child(2),.workspace-entering #content>:nth-child(2){--entry:1}
.workspace-entering #nav>button:nth-child(3),.workspace-entering #content>:nth-child(3){--entry:2}
.workspace-entering #nav>button:nth-child(4),.workspace-entering #content>:nth-child(4){--entry:3}
.workspace-entering #nav>button:nth-child(5),.workspace-entering #content>:nth-child(5){--entry:4}
.workspace-entering #nav>button:nth-child(6),.workspace-entering #content>:nth-child(6){--entry:5}
.workspace-entering #nav>button:nth-child(7),.workspace-entering #content>:nth-child(7){--entry:6}
.workspace-entering #nav>button:nth-child(8),.workspace-entering #content>:nth-child(8){--entry:7}
.workspace-entering #nav>button:nth-child(9),.workspace-entering #content>:nth-child(9){--entry:8}
.workspace-entering #nav>button:nth-child(10),.workspace-entering #content>:nth-child(10){--entry:9}
.workspace-entering #nav>button:nth-child(11),.workspace-entering #content>:nth-child(11){--entry:10}
.workspace-entering #nav>button:nth-child(12),.workspace-entering #content>:nth-child(12){--entry:11}
.workspace-entering #nav>button:nth-child(13),.workspace-entering #content>:nth-child(13){--entry:12}
@media(prefers-reduced-motion:reduce){.auth-shell.auth-departing,.auth-departing .auth-card,.workspace-entering>aside,.workspace-entering>main,.workspace-entering #nav>button,.workspace-entering #content>*,.workspace-entering .cloud-status{animation:none!important}}

/* Brand signature: dimensional turn, signature reveal, then docking to sidebar. */
.brand-arriving aside .brand-logo{visibility:hidden}
#brand-arrival{position:fixed;inset:0;z-index:10020;pointer-events:none;display:grid;place-items:center;perspective:1000px;background:radial-gradient(ellipse at center,#0b101bdd, #07090f80);animation:brand-stage-in .5s ease both}
.brand-arrival-halo{position:absolute;width:min(80vw,620px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#b8ceff20,transparent 66%);filter:blur(18px)}
.brand-flight{position:absolute;left:calc(50% - min(24vw,180px)/2);top:calc(45% - min(24vw,180px)/2);width:min(24vw,180px);height:min(24vw,180px);transform-origin:center;will-change:transform;perspective:900px}
.brand-medallion{width:100%;height:100%;position:relative;transform-style:preserve-3d;animation:brand-dimensional-turn 2.1s cubic-bezier(.22,.7,.2,1) both}
.brand-medallion:before{content:'';position:absolute;inset:0;background:linear-gradient(130deg,#c8cbd0,#343740 45%,#8c7256);border-radius:12px;transform:translateZ(-10px);box-shadow:12px 15px 30px #0009}
.brand-arrival-image{display:block;width:100%;height:100%;object-fit:fill;border-radius:10px;transform:translateZ(1px);box-shadow:0 0 0 1px #ffffff35,0 18px 60px #0008}
.brand-signature{position:absolute;top:calc(45% + min(24vw,180px)/2 + 28px);text-align:center;color:#e8e9ee;overflow:hidden;animation:brand-signature-reveal 1.1s cubic-bezier(.22,1,.36,1) .65s both}
.brand-signature span{display:block;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:#a6aab4;margin-bottom:10px}
.brand-signature strong{font-size:clamp(17px,3.5vw,25px);font-weight:500;letter-spacing:1px}
#brand-arrival.brand-arrival-docking{background:transparent;transition:background 1s ease}
.brand-arrival-docking .brand-signature,.brand-arrival-docking .brand-arrival-halo{opacity:0;transition:opacity .45s ease;animation:none}
.brand-arrival-docking .brand-arrival-image{border-radius:0;box-shadow:none;transition:border-radius 1.2s,box-shadow 1.2s}
.brand-arrival-docking .brand-medallion:before{opacity:0;transition:opacity .5s}
@keyframes brand-stage-in{from{opacity:0}to{opacity:1}}
@keyframes brand-dimensional-turn{0%{opacity:0;transform:translateZ(-170px) rotateX(16deg) rotateY(-100deg) scale(.7)}22%{opacity:1}72%{transform:translateZ(35px) rotateX(-5deg) rotateY(345deg) scale(1.04)}100%{opacity:1;transform:translateZ(0) rotateX(0) rotateY(360deg) scale(1)}}
@keyframes brand-signature-reveal{from{opacity:0;transform:translateY(-18px);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:translateY(0);clip-path:inset(0)}}
@media(prefers-reduced-motion:reduce){#brand-arrival{display:none}.brand-arriving aside .brand-logo{visibility:visible}}

.team-presence{padding:8px 12px 14px;margin-bottom:12px;border-bottom:1px solid #ffffff12;display:grid;gap:15px}.presence-person{display:flex;gap:13px;align-items:center;min-height:36px}.presence-person>div{min-width:0}.presence-person strong{display:block;font-size:12px;font-weight:500;color:#e4e8df;line-height:1.5}.presence-person small{display:block;font-size:10px;color:#b0b7a8;line-height:1.5;margin-top:2px}.presence-orb{--pulse-color:#edc35d;position:relative;display:block;flex:0 0 8px;width:8px;height:8px;border-radius:50%;background:var(--pulse-color);box-shadow:0 0 10px color-mix(in srgb,var(--pulse-color) 40%,transparent);animation:presence-glow 3.2s ease-in-out infinite}.presence-orb.online{--pulse-color:#74df9b}.presence-orb:before,.presence-orb:after{content:'';position:absolute;inset:-1px;border:1px solid var(--pulse-color);border-radius:50%;animation:presence-wave 3.2s ease-out infinite;pointer-events:none}.presence-orb:after{animation-delay:1.6s}.presence-orb.away{animation-delay:.8s}.presence-orb.away:before{animation-delay:.8s}.presence-orb.away:after{animation-delay:2.4s}.presence-unavailable{color:#b1b8aa;font-size:10px;line-height:1.6}@keyframes presence-wave{0%{opacity:.55;transform:scale(1)}85%,100%{opacity:0;transform:scale(2.8)}}@keyframes presence-glow{0%,100%{opacity:.75}50%{opacity:1}}@media(prefers-reduced-motion:reduce){.presence-orb,.presence-orb:before,.presence-orb:after{animation:none}.presence-orb:before,.presence-orb:after{display:none}}

/* Airier, aligned account activity cards. */
#team-activity-results{display:grid;gap:24px;margin-top:24px}
#team-activity-results .team-activity-card{margin:0;padding:28px 32px}
.team-activity-card h3{margin:0 0 14px;line-height:1.4}
.team-activity-card .team-activity-state{margin:0 0 24px;line-height:1.6}
.team-activity-details{display:grid;gap:18px;margin:0}
.team-activity-details>div{display:grid;grid-template-columns:minmax(180px,1fr) minmax(160px,1.4fr);gap:24px;align-items:baseline}
.team-activity-details dt{color:#777b80;line-height:1.6}
.team-activity-details dd{margin:0;color:#383b3e;line-height:1.6;font-variant-numeric:tabular-nums}
#team-activity-results .team-activity-note{margin:4px 0 0;line-height:1.8;max-width:850px}
@media(max-width:650px){#team-activity-results{gap:20px;margin-top:20px}#team-activity-results .team-activity-card{padding:24px 20px}.team-activity-details>div{grid-template-columns:1fr;gap:4px}.team-activity-details{gap:20px}}
/* Presence lives in the account popover, not permanently in the sidebar. */
#account-menu{width:300px;max-width:calc(100vw - 32px);max-height:70vh;overflow-y:auto}
#account-menu .account-label{overflow-wrap:anywhere;line-height:1.6;padding:16px 18px}
#account-menu .team-presence{padding:16px 20px;margin:0;gap:22px;border-top:1px solid #ffffff12;border-bottom:0}
#account-menu .presence-person{align-items:flex-start;gap:15px}
#account-menu .presence-orb{margin-top:6px}
#account-menu .presence-person strong{color:inherit;font-size:13px}
#account-menu .presence-person small{color:inherit;opacity:.65;font-size:11px;line-height:1.7}

/* Smooth account popover entrance; keeps native hidden behaviour. */
#account-menu:not([hidden]){transform-origin:bottom left;animation:account-popover-reveal .85s cubic-bezier(.25,.46,.45,.94) both}
@keyframes account-popover-reveal{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){#account-menu:not([hidden]){animation:none}}

/* Reserve both account rows before the cloud reply so the popover cannot jump. */
#account-menu .team-presence{min-height:178px;align-content:start;grid-auto-rows:minmax(62px,auto)}
#account-menu .presence-person{min-height:62px}

/* Shared gentle button feedback, with independent icon motion. */
body button:not(:disabled),body .btn{transition:background-color .55s ease,color .55s ease,border-color .55s ease,box-shadow .55s ease,filter .55s ease,transform .55s ease}
button svg[data-icon],button .button-symbol,.auth-submit>span{transform-origin:center;transform-box:fill-box;transition:transform .6s cubic-bezier(.25,.46,.45,.94),color .55s ease;display:inline-block}
@media(hover:hover) and (pointer:fine){
 button:not(:disabled):hover{filter:brightness(1.07)}
 button:not(:disabled):hover svg[data-icon],button:not(:disabled):hover .button-symbol{transform:rotate(-10deg)}
 button:not(:disabled):hover svg[data-icon="plus"]{transform:rotate(-18deg)}
 .auth-submit:not(:disabled):hover>span{transform:translate(2px,-2px) rotate(-8deg)}
}
button:not(:disabled):focus-visible svg[data-icon],button:not(:disabled):focus-visible .button-symbol{transform:rotate(-10deg)}
button:not(:disabled):focus-visible svg[data-icon="plus"]{transform:rotate(-18deg)}
@media(prefers-reduced-motion:reduce){body button:not(:disabled),body .btn,button svg[data-icon],button .button-symbol,.auth-submit>span{transition:none}button:not(:disabled):is(:hover,:focus-visible) svg[data-icon],button:not(:disabled):is(:hover,:focus-visible) .button-symbol,.auth-submit:not(:disabled):hover>span{transform:none}}
/* Session restoration is neutral: never flash the sign-in form. */
body.auth-restoring{background:#f8f8f8}body.auth-restoring .auth-shell{display:none}body.auth-restoring:after{content:'Открываем пространство…';position:fixed;inset:0;display:grid;place-items:center;color:#73737c;font-size:13px;letter-spacing:.2px;pointer-events:none}
