#personality-menu{position:fixed;inset:auto 0 0;margin:0;border:0;width:100%;max-width:none;max-height:96dvh;padding:0;color:#012850;background:#fff;border-radius:28px 28px 0 0;overflow:auto;font:400 16px/1.5 Manrope,sans-serif}
#personality-menu *{box-sizing:border-box}
#personality-menu::backdrop{background:#01285077;backdrop-filter:blur(5px)}
#personality-menu[open]{animation:tw-menu04-open .55s cubic-bezier(.2,.8,.2,1)}
@keyframes tw-menu04-open{from{opacity:0;transform:translateY(80px)}to{opacity:1;transform:translateY(0)}}
#personality-menu.closing{animation:tw-menu04-close .25s ease forwards}
@keyframes tw-menu04-close{to{opacity:0;transform:translateY(40px)}}
#personality-menu a{color:inherit;text-decoration:none}
#personality-menu .mono{font:400 12px/1.6 'DM Mono',monospace}
#personality-menu .mark{display:block;width:72px;aspect-ratio:1.75;background:#012850;mask:url('/assets/tw-monogram-navy.png') center/contain no-repeat;-webkit-mask:url('/assets/tw-monogram-navy.png') center/contain no-repeat}
#personality-menu .menu-top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:25px 4vw}
#personality-menu .close{border:0;border-radius:99px;padding:10px 16px;font:12px 'DM Mono',monospace;background:#eaf0ff;color:#012850;cursor:pointer}
#personality-menu .menu-body{padding:15px 4vw 30px;display:grid;grid-template-columns:.75fr 1.75fr;gap:4vw}
#personality-menu .welcome{padding:35px;border-radius:28px;background:#fdfa2d;display:flex;flex-direction:column;justify-content:space-between;gap:35px;position:relative;overflow:hidden}

#personality-menu .welcome h2{font:600 clamp(40px,4.6vw,66px)/1.02 Manrope,sans-serif;letter-spacing:-.06em;margin:18px 0;color:#012850;position:relative;z-index:1}
#personality-menu .welcome p{font-size:15px;max-width:300px}
#personality-menu .talk{display:grid;gap:8px}
#personality-menu .talk>a{width:fit-content}
#personality-menu .cta{display:flex!important;justify-content:space-between;align-items:center;gap:25px;background:#0051fe;color:#fff!important;padding:15px 20px;border-radius:99px;font:12px 'DM Mono',monospace;margin:15px 0 0;width:100%!important;transition:background .2s}
#personality-menu .cta:hover{background:#012850}
#personality-menu .groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 35px;align-content:start}
#personality-menu .group{min-width:0;background:none;padding:0 0 18px;border-radius:0;border-bottom:1px solid #01285022}
#personality-menu .group h3{font:600 32px/1.1 Manrope,sans-serif;letter-spacing:-.04em;margin:5px 0 10px;color:#012850}
#personality-menu .group>.mono{color:#0051fe;font-size:10px}
#personality-menu .group>p{display:none}
#personality-menu .group-links{display:flex;flex-wrap:wrap;gap:7px 18px}
#personality-menu .group a{font-size:14px;line-height:1.4;display:block;width:fit-content}
#personality-menu .group a span,#personality-menu .talk a:not(.cta),#personality-menu .menu-bottom a{background:linear-gradient(currentColor,currentColor) left bottom/0 1px no-repeat;transition:background-size .25s}
#personality-menu .group a:hover span,#personality-menu .talk a:not(.cta):hover,#personality-menu .menu-bottom a:hover{background-size:100% 1px}
#personality-menu .menu-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 4vw 25px;font:11px/1.6 'DM Mono',monospace;margin-top:10px}
#personality-menu a:focus-visible,#personality-menu button:focus-visible{outline:2px solid #0051fe;outline-offset:4px}
@media(max-width:750px){#personality-menu{max-height:94dvh}#personality-menu .menu-top{padding:20px}#personality-menu .menu-top>.mono{display:none}#personality-menu .menu-body{grid-template-columns:1fr;padding:0 20px 20px;gap:24px}#personality-menu .welcome{padding:26px;gap:15px}#personality-menu .welcome h2{font-size:40px}#personality-menu .welcome>div>p{display:none}#personality-menu .groups{gap:22px 20px}#personality-menu .group h3{font-size:25px}#personality-menu .group-links{display:grid;gap:10px}#personality-menu .menu-bottom{padding:20px;flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){#personality-menu,#personality-menu *{animation:none!important;transition:none!important}}
/* A quieter resting state: section-link arrows reveal without shifting labels. */
#personality-menu .group-links a{position:relative;padding-right:1.35em}
#personality-menu .group-links a .menu-link-arrow{position:absolute;right:0;top:50%;display:inline-block;opacity:0;transform:translate(-5px,-50%);background:none!important;transition:opacity .2s ease,transform .2s ease;pointer-events:none}
#personality-menu .group-links a:is(:hover,:focus-visible) .menu-link-arrow{opacity:1;transform:translate(0,-50%)}
#personality-menu .group-links a:is(:hover,:focus-visible) .menu-link-label{background-size:100% 1px}
@media(prefers-reduced-motion:reduce){#personality-menu .group-links a .menu-link-arrow{transition:none!important}}
/* Keep section links in the original Manrope mixed-case styling. */
html body #personality-menu .group-links a{font:400 14px/1.4 Manrope,sans-serif!important;text-transform:none!important;letter-spacing:normal!important}
html body #personality-menu .group-links a .menu-link-label{font:inherit!important;text-transform:none!important;letter-spacing:inherit!important}
html body #personality-menu .group-links a .menu-link-arrow{font:inherit!important;text-transform:none!important}
