/* Extension of the SSO design kit. Brand colors remain blue #336AC7 / yellow #F8CB28. */
:root{--sso-blue:#336ac7;--sso-yellow:#f8cb28;--sso-ease:cubic-bezier(.16,1,.3,1);--sso-slow:850ms;--sso-border:color-mix(in srgb,var(--brand) 24%,var(--line));}
body{background-image:radial-gradient(ellipse at 75% 0%,color-mix(in srgb,var(--sso-blue) 13%,transparent),transparent 65%)}
.frame .rail{border-color:var(--sso-border);background-image:linear-gradient(155deg,color-mix(in srgb,var(--sso-blue) 8%,transparent),transparent 60%)}
.rail .logo{padding-top:8px;padding-bottom:20px}.rail .logo img{height:32px;max-width:152px;filter:drop-shadow(0 4px 12px color-mix(in srgb,var(--sso-blue) 18%,transparent))}
.rail-menu button{transition:background-color 350ms,color 350ms,box-shadow 500ms var(--sso-ease);position:relative}.rail-menu button.on{box-shadow:inset 3px 0 var(--sso-yellow);background:color-mix(in srgb,var(--sso-blue) 16%,transparent)}
.sso-heading{position:relative;isolation:isolate;overflow:hidden;min-height:210px;padding:32px!important;border-radius:22px;background:linear-gradient(118deg,#173e7c 0%,#255cb0 62%,#336ac7 100%);border:1px solid color-mix(in srgb,var(--sso-blue) 55%,transparent);color:#fff;box-shadow:0 18px 45px #16386b20;gap:24px}
.sso-heading:before,.sso-heading:after{content:'';position:absolute;pointer-events:none;z-index:-1;border-radius:50%}.sso-heading:before{width:290px;height:290px;right:-100px;top:-125px;border:36px solid #f8cb2838;transform:rotate(-25deg)}.sso-heading:after{width:340px;height:340px;right:45px;bottom:-300px;border:1px solid #ffffff40}
.sso-heading>div{max-width:540px}.sso-heading .sso-eyebrow{color:#ffe77c;font-size:10px;letter-spacing:.2em}.sso-heading h1{font-size:clamp(24px,2.5vw,34px);font-weight:700;letter-spacing:-.035em;max-width:480px}.sso-heading p{color:#e1ebff!important;line-height:1.7;max-width:390px}.sso-heading .btn-dark{background:var(--sso-yellow)!important;color:#17355c!important;box-shadow:0 8px 22px #102a5740;white-space:nowrap;border:0;min-height:46px;font-weight:700}
.sso-tabs{border:0!important;gap:6px;padding:5px!important;background:color-mix(in srgb,var(--brand) 7%,var(--card));border-radius:14px;width:fit-content;max-width:100%}.sso-tabs button{border:0!important;border-radius:10px;min-height:44px;transition:background 400ms,box-shadow 500ms var(--sso-ease),color 300ms}.sso-tabs button[aria-pressed=true]{background:var(--sso-blue)!important;color:white;box-shadow:0 4px 14px #336ac72b}
.sso-metrics>div{position:relative;overflow:hidden;border-color:var(--sso-border);background-image:linear-gradient(145deg,color-mix(in srgb,var(--brand) 5%,transparent),transparent);box-shadow:0 5px 20px #12336108}.sso-metrics>div:before{content:'';height:3px;width:42px;border-radius:0 0 4px 4px;position:absolute;top:0;left:22px;background:var(--sso-blue)}.sso-metrics>div:nth-child(2):before{background:var(--sso-yellow)}.sso-metrics strong{font-size:clamp(23px,2.2vw,30px);letter-spacing:-.03em;font-variant-numeric:tabular-nums}.sso-metrics>div>span{font-size:12px;font-weight:600}.sso-metrics small{font-size:11px;line-height:1.6}
.sso-empty{background-image:radial-gradient(ellipse at right bottom,color-mix(in srgb,var(--sso-blue) 10%,transparent),transparent 70%);border-color:var(--sso-border)}
.sso-actions>button,.sso-entries>article,.main .card,.sso-metrics>div{transition:translate 650ms var(--sso-ease),box-shadow 650ms var(--sso-ease),border-color 450ms}.sso-actions>button{min-height:124px}.sso-actions>button>small{display:flex;align-items:center;gap:8px}.sso-upload{position:relative;overflow:hidden;border:1px dashed var(--brand)!important;min-height:130px;background-image:linear-gradient(120deg,transparent,color-mix(in srgb,var(--sso-blue) 8%,transparent));transition:border-color 450ms,box-shadow 650ms var(--sso-ease)}.sso-upload:before{content:'';position:absolute;inset:0;pointer-events:none;transform:translateX(-120%);background:linear-gradient(110deg,transparent 30%,color-mix(in srgb,var(--sso-yellow) 13%,transparent) 50%,transparent 70%)}
.btn-dark,.btn-ghost,.btn-mini{transition:box-shadow 450ms var(--sso-ease),background-color 300ms,translate 450ms var(--sso-ease)}
.sso-motion-toggle{position:fixed;right:24px;bottom:16px;z-index:40;display:flex;align-items:center;gap:8px;background:var(--card);color:var(--ink);border:1px solid var(--sso-border);border-radius:30px;padding:9px 14px;font:inherit;font-size:11px;box-shadow:0 4px 20px #102a5715;cursor:pointer;min-height:40px}.sso-motion-toggle span{color:var(--brand)}.sso-home{padding-bottom:76px}.sso-home :focus-visible{outline:3px solid var(--sso-yellow);outline-offset:4px}
@media(hover:hover) and (pointer:fine){html:not([data-sso-motion=off]) .sso-actions>button:hover{translate:0 -4px;box-shadow:0 12px 24px #173e7c18;border-color:var(--brand)}html:not([data-sso-motion=off]) .sso-metrics>div:hover{translate:0 -3px;box-shadow:0 10px 26px #173e7c12}.sso-upload:hover{border-color:var(--sso-yellow)!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--sso-blue) 8%,transparent)}html:not([data-sso-motion=off]) .sso-upload:hover:before{animation:sso-sweep 1400ms var(--sso-ease) 1}html:not([data-sso-motion=off]) .btn-dark:hover{translate:0 -2px;box-shadow:0 8px 22px #12336130}}
html[data-sso-motion=on] .sso-heading:before{animation:sso-orbit 1900ms var(--sso-ease) 1}html[data-sso-motion=on] .sso-upload:disabled:before{animation:sso-sweep 1800ms ease-in-out infinite}
@keyframes sso-sweep{from{transform:translateX(-120%)}to{transform:translateX(120%)}}@keyframes sso-orbit{from{transform:translate(45px,-35px) rotate(-50deg);opacity:0}to{transform:translate(0,0) rotate(-25deg);opacity:1}}
@media(max-width:760px){.sso-heading{padding:24px!important;min-height:240px;border-radius:18px}.sso-heading h1{font-size:26px}.sso-heading:before{width:200px;height:200px;right:-90px;top:-90px;border-width:25px}.sso-heading>div{max-width:100%}.sso-heading .btn-dark{white-space:normal}.sso-tabs{width:100%}.sso-motion-toggle{right:16px;bottom:12px}.rail .logo img{height:27px}.sso-home{padding-bottom:76px!important}.sso-metrics{gap:10px}.sso-metrics>div{gap:7px}.sso-metrics strong{font-size:25px}}
html[data-sso-motion=off] *,html[data-sso-motion=off] *:before,html[data-sso-motion=off] *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}