.modal{z-index:1000;visibility:hidden;opacity:0;pointer-events:none;width:100vw;height:100vh;transition:opacity .22s var(--ease-out), visibility .22s var(--ease-out);justify-content:center;align-items:center;padding:24px 20px;display:flex;position:fixed;top:0;left:0;overflow-y:auto}.modal.hidden{display:flex!important}.modal:not(.hidden){visibility:visible;opacity:1;pointer-events:auto}.modal:before{content:"";background:var(--color-modal-backdrop);-webkit-backdrop-filter:blur(var(--modal-backdrop-blur));z-index:-1;position:absolute;top:0;bottom:0;left:0;right:0}.modal:has(>.modal-backdrop):before{display:none}.modal-backdrop{background:var(--color-modal-backdrop);width:100%;height:100%;-webkit-backdrop-filter:blur(var(--modal-backdrop-blur));z-index:-1;position:absolute;top:0;left:0}:where(.modal-container){background:var(--color-bg-panel);width:100%;max-width:480px;max-height:90vh;transition:transform .3s var(--ease-drawer), opacity .22s var(--ease-out);position:relative;overflow:hidden;transform:scale(.92)translateY(16px)}.modal:not(.hidden) :where(.modal-container){transform:scale(1)translateY(0)}.modal>:where(.modal-content){transition:transform .25s var(--ease-out), opacity .2s var(--ease-out);transform:scale(.95)translateY(10px)}.modal:not(.hidden)>:where(.modal-content){transform:scale(1)translateY(0)}:where(.modal-container,.modal>.modal-content){border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-modal)}:where(.modal-container>.modal-content){border-radius:inherit}:where(.modal-content){background:var(--color-bg-panel);color:var(--color-text-primary);flex-direction:column;gap:20px;padding:32px;display:flex;position:relative}:where(.modal-content) h3{color:var(--text-primary);letter-spacing:-.4px;font-size:20px;font-weight:700}.modal-btns{flex-direction:column;gap:12px;margin-top:8px;display:flex}.modal-btns.horizontal{flex-direction:row;justify-content:flex-end}.modal-btns.horizontal .btn-primary,.modal-btns.horizontal .btn-secondary{min-width:100px;padding:10px 20px;font-size:14px}:where(.close-modal-btn){background:var(--color-bg-surface-hover);border:1px solid var(--color-border);cursor:pointer;width:36px;height:36px;color:var(--text-muted);transition:background-color .16s var(--ease-out), color .16s var(--ease-out), border-color .16s var(--ease-out), transform .16s var(--ease-out);z-index:10;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;top:16px;right:16px}:where(.close-modal-btn:hover){background:var(--color-selected-bg);color:var(--color-selected-text);border-color:var(--color-border)}@media (hover:hover) and (pointer:fine){:where(.close-modal-btn:hover){transform:rotate(90deg)scale(1.05)}}@media (max-width:768px){.modal{align-items:flex-start;padding:20px 16px}:where(.modal-container){max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);overflow-y:auto}:where(.modal-container,.modal>.modal-content){border-radius:var(--radius-lg)}.modal>:where(.modal-content,.modal-container){width:100%;margin:auto}:where(.modal-content){gap:16px;min-width:0;padding:24px 20px}:where(.close-modal-btn){-webkit-tap-highlight-color:var(--color-touch-highlight);touch-action:manipulation;-webkit-user-select:none;user-select:none}}@media (prefers-reduced-motion:reduce){.modal,.modal-container,.modal>.modal-content,.close-modal-btn{transition:none}}