.surface-panel{pointer-events:auto;-webkit-backdrop-filter:blur(2px)saturate(1.5);backdrop-filter:blur(2px)saturate(1.5);color:#fff;cursor:pointer;box-shadow:none;-webkit-tap-highlight-color:transparent;will-change:transform;z-index:50;background:#ffffff12;border-color:#fff3;outline:none;flex-direction:column;transition:opacity .15s;display:flex}.surface-panel[data-hidden=true]{display:none}.surface-panel *{box-shadow:none;outline:none}.surface-inner{flex:1;position:relative}.surface-content{flex-direction:column;align-items:stretch;display:flex}.surface-panel{border-top:1px solid #fff3;height:100lvh;transform:translateY(20%)}@media (min-width:768px){.surface-panel{border-top:none;border-right:1px solid #fff3;width:100vw;height:auto;position:fixed;inset:0 auto 0 0;transform:translate(-20vw)}.surface-inner{opacity:1}.surface-content{width:80vw;margin-left:auto;position:relative}}@media (max-width:767px){.surface-panel{max-height:100lvh;overflow:hidden}}@media (hover:hover) and (pointer:fine){.surface-panel{-webkit-user-select:none;user-select:none}}