.modal-sm{max-width:360px}.modal-md{max-width:480px}.modal-lg{max-width:640px}@media (max-width:768px){.modal-overlay{top:var(--modal-visual-viewport-top,0px);height:var(--modal-visual-viewport-height,100dvh);z-index:calc(var(--z-modal,1200) + 20);justify-content:center;align-items:flex-end;padding:0;bottom:auto}.modal{width:100%;max-width:100%;max-height:calc(var(--modal-visual-viewport-height,100dvh) - max(12px, env(safe-area-inset-top,0px)));border-radius:var(--radius-xl) var(--radius-xl) 0 0;margin:0;padding-top:20px;animation:.26s cubic-bezier(.32,.72,0,1) modalBottomSheetIn;box-shadow:0 -18px 54px #0f172a3d}.modal:before{content:"";border-radius:var(--radius-full);background:var(--color-text-tertiary);opacity:.45;width:36px;height:4px;position:absolute;top:8px;left:50%;transform:translate(-50%)}.modal.closing{animation:.18s cubic-bezier(.32,.72,0,1) forwards modalBottomSheetOut}.modal-header{padding:var(--spacing-sm) var(--spacing-md) var(--spacing-md);flex-shrink:0}.modal-title{font-size:var(--font-size-base)}.modal-body{padding:var(--spacing-md);flex:auto;min-height:0}.modal-footer{padding:var(--spacing-md);padding-bottom:max(calc(var(--spacing-md) + env(safe-area-inset-bottom,0px)), var(--spacing-xl));gap:var(--spacing-sm);background:var(--color-bg-primary);flex-wrap:wrap;flex-shrink:0}.modal-footer .btn{flex:1;min-width:100px}html.modal-keyboard-open .modal{height:calc(var(--modal-visual-viewport-height,100dvh) - 8px);max-height:calc(var(--modal-visual-viewport-height,100dvh) - 8px);padding-top:14px}html.modal-keyboard-open .modal:before{top:6px}html.modal-keyboard-open .modal-header{padding-block:8px 10px}html.modal-keyboard-open .modal-body{padding-block:var(--spacing-sm)}html.modal-keyboard-open .modal-footer{padding-block:var(--spacing-sm);padding-bottom:max(var(--spacing-sm), env(safe-area-inset-bottom,0px))}}@supports not (height:100dvh){@media (max-width:768px){.modal{max-height:calc(var(--app-height,100vh) - max(12px, env(safe-area-inset-top,0px)))}}}@keyframes modalBottomSheetIn{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes modalBottomSheetOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100%)}}