/* Shared by the public pages (landing at /, sign in at /login): Söhne, keycaps, confetti. Values from design/onward-redesign/screens. */
@font-face{font-family:'Sohne';src:url(assets/fonts/Sohne-Buch.woff) format('woff');font-weight:100 900;font-style:normal;font-display:swap}
html{font-synthesis:none;scroll-behavior:smooth;overflow-x:clip} /* clip, not hidden: a phone cannot pan sideways at all (user, 2026-10-05) */
body{margin:0;background:#F4F5F8;color:#1B1D26;font-family:'Sohne',-apple-system,BlinkMacSystemFont,'SF Pro Display','Helvetica Neue',system-ui,sans-serif;letter-spacing:-0.01em;overflow-x:clip;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
a{color:#0066CC}a:hover{color:#004C99}
button,input{font-family:inherit}
section[id]{scroll-margin-top:80px}
.skip-link{position:absolute;left:16px;top:-80px;z-index:50;padding:12px 18px;border-radius:999px;background:#1B1D26;color:#FFFFFF;font-weight:700;text-decoration:none}
.skip-link:focus{top:12px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.key{position:relative;display:inline-flex;padding:0;border:0;margin-top:6px;cursor:pointer;text-decoration:none;-webkit-tap-highlight-color:transparent;user-select:none;box-shadow:0 14px 24px -12px rgba(14,16,24,.35);border-radius:999px}
.cap{display:flex;width:100%;align-items:center;border-radius:999px;transform:translateY(-6px);transition:transform 90ms cubic-bezier(.3,.7,.4,1),background .3s ease;box-shadow:inset 0 1.5px 0 rgba(255,255,255,.35),inset 0 -1px 0 rgba(14,16,24,.06)}
.key:hover .cap{transform:translateY(-7px)}
.key:active .cap{transform:translateY(-1px) !important;transition-duration:40ms}
.key:disabled{opacity:.45;cursor:default;box-shadow:none}
.key:focus-visible,.card:focus-visible,a:focus-visible{outline:3px solid rgba(0,113,227,.5);outline-offset:4px}
#confetti{position:fixed;inset:0;z-index:45;pointer-events:none;overflow:hidden}
.cf{position:absolute;bottom:20%;display:block;opacity:0;animation-duration:1.8s;animation-timing-function:cubic-bezier(.15,.7,.3,1);animation-fill-mode:forwards;will-change:transform,opacity}
.cf0{animation-name:cf0}.cf1{animation-name:cf1}.cf2{animation-name:cf2}.cf3{animation-name:cf3}.cf4{animation-name:cf4}.cf5{animation-name:cf5}.cf6{animation-name:cf6}.cf7{animation-name:cf7}
@keyframes cf0{0%{opacity:1;transform:translate(0,0) rotate(0)}35%{opacity:1;transform:translate(-26vw,-52vh) rotate(260deg)}100%{opacity:0;transform:translate(-34vw,6vh) rotate(760deg)}}
@keyframes cf1{0%{opacity:1;transform:translate(0,0) rotate(0)}35%{opacity:1;transform:translate(26vw,-52vh) rotate(-260deg)}100%{opacity:0;transform:translate(34vw,6vh) rotate(-760deg)}}
@keyframes cf2{0%{opacity:1;transform:translate(0,0) rotate(0)}35%{opacity:1;transform:translate(-12vw,-64vh) rotate(200deg)}100%{opacity:0;transform:translate(-18vw,10vh) rotate(640deg)}}
@keyframes cf3{0%{opacity:1;transform:translate(0,0) rotate(0)}35%{opacity:1;transform:translate(12vw,-64vh) rotate(-200deg)}100%{opacity:0;transform:translate(18vw,10vh) rotate(-640deg)}}
@keyframes cf4{0%{opacity:1;transform:translate(0,0) rotate(0)}35%{opacity:1;transform:translate(-38vw,-36vh) rotate(320deg)}100%{opacity:0;transform:translate(-46vw,14vh) rotate(900deg)}}
@keyframes cf5{0%{opacity:1;transform:translate(0,0) rotate(0)}35%{opacity:1;transform:translate(38vw,-36vh) rotate(-320deg)}100%{opacity:0;transform:translate(46vw,14vh) rotate(-900deg)}}
@keyframes cf6{0%{opacity:1;transform:translate(0,0) rotate(0)}35%{opacity:1;transform:translate(-4vw,-72vh) rotate(160deg)}100%{opacity:0;transform:translate(-6vw,4vh) rotate(560deg)}}
@keyframes cf7{0%{opacity:1;transform:translate(0,0) rotate(0)}35%{opacity:1;transform:translate(4vw,-72vh) rotate(-160deg)}100%{opacity:0;transform:translate(6vw,4vh) rotate(-560deg)}}
.cfd{position:absolute;top:-6%;display:block;opacity:0;animation-duration:2.6s;animation-timing-function:cubic-bezier(.3,.1,.4,1);animation-fill-mode:forwards}
.cfd0{animation-name:cfd0}.cfd1{animation-name:cfd1}.cfd2{animation-name:cfd2}
@keyframes cfd0{0%{opacity:1;transform:translate(0,0) rotate(0)}50%{transform:translate(4vw,55vh) rotate(220deg)}100%{opacity:0;transform:translate(-2vw,110vh) rotate(480deg)}}
@keyframes cfd1{0%{opacity:1;transform:translate(0,0) rotate(0)}50%{transform:translate(-5vw,50vh) rotate(-200deg)}100%{opacity:0;transform:translate(3vw,110vh) rotate(-460deg)}}
@keyframes cfd2{0%{opacity:1;transform:translate(0,0) rotate(0)}50%{transform:translate(2vw,60vh) rotate(160deg)}100%{opacity:0;transform:translate(-4vw,112vh) rotate(380deg)}}
.cfs{position:absolute;bottom:8%;display:block;opacity:0;animation-duration:1.9s;animation-timing-function:cubic-bezier(.15,.7,.3,1);animation-fill-mode:forwards}
.cfsl0{left:2%;animation-name:cfsl0}.cfsl1{left:2%;animation-name:cfsl1}.cfsl2{left:2%;animation-name:cfsl2}
.cfsr0{right:2%;animation-name:cfsr0}.cfsr1{right:2%;animation-name:cfsr1}.cfsr2{right:2%;animation-name:cfsr2}
@keyframes cfsl0{0%{opacity:1;transform:translate(0,0) rotate(0)}40%{opacity:1;transform:translate(30vw,-62vh) rotate(300deg)}100%{opacity:0;transform:translate(44vw,4vh) rotate(800deg)}}
@keyframes cfsl1{0%{opacity:1;transform:translate(0,0) rotate(0)}40%{opacity:1;transform:translate(42vw,-48vh) rotate(260deg)}100%{opacity:0;transform:translate(58vw,8vh) rotate(700deg)}}
@keyframes cfsl2{0%{opacity:1;transform:translate(0,0) rotate(0)}40%{opacity:1;transform:translate(18vw,-72vh) rotate(200deg)}100%{opacity:0;transform:translate(28vw,2vh) rotate(620deg)}}
@keyframes cfsr0{0%{opacity:1;transform:translate(0,0) rotate(0)}40%{opacity:1;transform:translate(-30vw,-62vh) rotate(-300deg)}100%{opacity:0;transform:translate(-44vw,4vh) rotate(-800deg)}}
@keyframes cfsr1{0%{opacity:1;transform:translate(0,0) rotate(0)}40%{opacity:1;transform:translate(-42vw,-48vh) rotate(-260deg)}100%{opacity:0;transform:translate(-58vw,8vh) rotate(-700deg)}}
@keyframes cfsr2{0%{opacity:1;transform:translate(0,0) rotate(0)}40%{opacity:1;transform:translate(-18vw,-72vh) rotate(-200deg)}100%{opacity:0;transform:translate(-28vw,2vh) rotate(-620deg)}}
.cfb{position:absolute;top:50%;display:block;opacity:0;animation-duration:1.4s;animation-timing-function:cubic-bezier(.1,.8,.3,1);animation-fill-mode:forwards}
.cfb0{animation-name:cfb0}.cfb1{animation-name:cfb1}.cfb2{animation-name:cfb2}.cfb3{animation-name:cfb3}.cfb4{animation-name:cfb4}.cfb5{animation-name:cfb5}.cfb6{animation-name:cfb6}.cfb7{animation-name:cfb7}
@keyframes cfb0{0%{opacity:1;transform:translate(0,0) scale(.4)}100%{opacity:0;transform:translate(0,-38vh) rotate(200deg) scale(1)}}
@keyframes cfb1{0%{opacity:1;transform:translate(0,0) scale(.4)}100%{opacity:0;transform:translate(27vh,-27vh) rotate(240deg) scale(1)}}
@keyframes cfb2{0%{opacity:1;transform:translate(0,0) scale(.4)}100%{opacity:0;transform:translate(38vh,0) rotate(280deg) scale(1)}}
@keyframes cfb3{0%{opacity:1;transform:translate(0,0) scale(.4)}100%{opacity:0;transform:translate(27vh,27vh) rotate(320deg) scale(1)}}
@keyframes cfb4{0%{opacity:1;transform:translate(0,0) scale(.4)}100%{opacity:0;transform:translate(0,38vh) rotate(-200deg) scale(1)}}
@keyframes cfb5{0%{opacity:1;transform:translate(0,0) scale(.4)}100%{opacity:0;transform:translate(-27vh,27vh) rotate(-240deg) scale(1)}}
@keyframes cfb6{0%{opacity:1;transform:translate(0,0) scale(.4)}100%{opacity:0;transform:translate(-38vh,0) rotate(-280deg) scale(1)}}
@keyframes cfb7{0%{opacity:1;transform:translate(0,0) scale(.4)}100%{opacity:0;transform:translate(-27vh,-27vh) rotate(-320deg) scale(1)}}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*{animation:none !important;transition:none !important}.cf,.cfd,.cfs,.cfb{display:none !important}}