.menu summary{position:relative;user-select:none}
.menu summary:after{content:'';display:block;float:none;position:absolute;right:35px;top:50%;width:20px;height:20px;margin:-10px 0 0;padding:0;border:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 4 7 12l8 8' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E") center/contain no-repeat;transform:rotate(0deg);transform-origin:center;transition:transform .25s ease}
.menu details[open] summary:after{content:''}
.menu details.is-open summary:after{content:'';margin:-10px 0 0;transform:rotate(-90deg)}
.menu details.is-current summary{background:#373737}
.menu a.active{background:#454545;color:#fff;font-weight:500;box-shadow:inset 4px 0 0 #555}
.menu div{max-height:0;overflow:hidden;opacity:0;padding:0;transition:max-height .32s ease,opacity .22s ease,padding .32s ease}
.menu details.is-open div{max-height:1200px;opacity:1;padding:0 0 8px}
:root{--menu:320px}
.logo{padding:0 34px 32px}
.logo img{width:245px}
