/* Cobalt awning shutter v1: one spec shared by the homepage exit and the Register entrance.
   Stripes, hem and scalloped valance are Version C's awning values, verbatim. */
.awning-shutter{position:fixed;inset:0;z-index:2147483000;overflow:hidden;pointer-events:none;contain:layout paint;--as-top:0px;--as-rest:0px}
.awning-shutter .as-panel{position:absolute;left:0;right:0;top:0;height:calc(100% + 44px);display:flex;flex-direction:column;will-change:transform}
.as-fabric{flex:1 1 auto;background-color:#1738B8;background-image:repeating-linear-gradient(0deg,rgba(12,26,82,0) 0 66px,rgba(12,26,82,.26) 66px 70px,rgba(255,255,255,.05) 70px 72px),repeating-linear-gradient(90deg,rgba(0,0,0,.07) 0,rgba(255,255,255,.05) 9px,rgba(0,0,0,0) 18px,rgba(0,0,0,.09) 36px),repeating-linear-gradient(90deg,#1738B8 0 36px,#1534A9 36px 72px);background-position:0 100%,0 0,0 0}
.as-hem{flex:none;height:16px;background-color:#1738B8;background-image:linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,0) 45%,rgba(255,255,255,.07) 80%,rgba(0,0,0,.08)),repeating-linear-gradient(90deg,rgba(0,0,0,.07) 0,rgba(255,255,255,.05) 9px,rgba(0,0,0,0) 18px,rgba(0,0,0,.09) 36px),repeating-linear-gradient(90deg,#1738B8 0 36px,#1534A9 36px 72px);box-shadow:inset 0 -2px 0 rgba(0,0,0,.22)}
.as-valance-wrap{flex:none;height:44px;background:#F3EBD8;filter:drop-shadow(0 8px 5px rgba(23,23,27,.25));-webkit-mask:linear-gradient(#000,#000) top/100% 25px no-repeat,radial-gradient(circle 18px at 18px 25px,#000 96%,transparent 100%) 0 0/36px 100% repeat-x;mask:linear-gradient(#000,#000) top/100% 25px no-repeat,radial-gradient(circle 18px at 18px 25px,#000 96%,transparent 100%) 0 0/36px 100% repeat-x}
.as-valance{height:41px;background-color:#1738B8;background-image:linear-gradient(rgba(255,255,255,.06),rgba(0,0,0,.12)),repeating-linear-gradient(90deg,rgba(0,0,0,.07) 0,rgba(255,255,255,.05) 9px,rgba(0,0,0,0) 18px,rgba(0,0,0,.09) 36px),repeating-linear-gradient(90deg,#1738B8 0 36px,#1534A9 36px 72px);-webkit-mask:linear-gradient(#000,#000) top/100% 22px no-repeat,radial-gradient(circle 18px at 18px 22px,#000 96%,transparent 100%) 0 0/36px 100% repeat-x;mask:linear-gradient(#000,#000) top/100% 22px no-repeat,radial-gradient(circle 18px at 18px 22px,#000 96%,transparent 100%) 0 0/36px 100% repeat-x}
/* Exit (homepage): 520 ms, from above the top edge down to full cover. */
.awning-shutter.is-exiting{pointer-events:auto}
.awning-shutter.is-exiting .as-panel{animation:as-roll-down 520ms cubic-bezier(.7,0,.2,1) both}
/* Entrance (login): 620 ms, full cover rolling up into the awning; the clip closes the top down to the awning's top. */
.awning-shutter.is-entering{animation:as-clip-up 620ms cubic-bezier(.7,0,.2,1) both}
.awning-shutter.is-entering .as-panel{animation:as-roll-up 620ms cubic-bezier(.7,0,.2,1) both}
@keyframes as-roll-down{from{transform:translateY(-100%)}to{transform:translateY(0)}}
@keyframes as-roll-up{from{transform:translateY(0)}to{transform:translateY(calc(var(--as-rest) - 100%))}}
@keyframes as-clip-up{from{clip-path:inset(0 0 0 0)}to{clip-path:inset(var(--as-top) 0 0 0)}}
@media (prefers-reduced-motion:reduce){.awning-shutter{display:none}}
