.modal{position:fixed;inset:0;z-index:400;display:flex;align-items:center;justify-content:center;padding:var(--space-4)}.modal[hidden]{display:none}.modal__backdrop{position:absolute;inset:0;background:rgba(37,45,67,.6);opacity:0;transition:opacity .3s ease}.modal.is-open .modal__backdrop{opacity:1}.modal__panel{position:relative;z-index:1;width:100%;max-width:480px;max-height:90vh;overflow-y:auto;background:var(--color-surface);border-radius:var(--radius-l);padding:var(--space-6);opacity:0;transform:translateY(16px) scale(.98);transition:opacity .3s ease,transform .3s ease;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:rgba(37,45,67,.3) transparent}.modal__panel::-webkit-scrollbar{width:8px}.modal__panel::-webkit-scrollbar-track{background:0 0;margin:14px 0}.modal__panel::-webkit-scrollbar-thumb{background:rgba(37,45,67,.28);border-radius:999px;border:2px solid transparent;background-clip:padding-box}.modal__panel::-webkit-scrollbar-thumb:hover{background:rgba(37,45,67,.5);background-clip:padding-box}.modal__panel textarea.form-field__control{resize:vertical;min-height:96px;max-height:220px}.modal.is-open .modal__panel{opacity:1;transform:none}.modal__close{position:absolute;top:var(--space-4);right:var(--space-4);width:36px;height:36px;border-radius:50%;background:var(--color-bg);display:flex;align-items:center;justify-content:center;font-size:1rem;transition:background .2s ease}.modal__close:hover{background:var(--color-border)}.modal__title{font-size:1.5rem;margin-bottom:var(--space-1);padding-right:calc(36px + var(--space-3))}.modal__subtitle{color:var(--color-text-muted);margin-bottom:var(--space-4)}