.modal-overlay{position:fixed;inset:0;background:#00000080;z-index:100;display:flex;align-items:center;justify-content:center;padding:16px}.modal{background:var(--surface);border-radius:var(--shape-xl);width:100%;max-width:560px;max-height:90dvh;display:flex;flex-direction:column}.modal--sm{max-width:380px}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 20px 0;gap:12px;flex-shrink:0}.modal-header h2{font-size:var(--font-size-18);font-weight:700;margin:0}.modal-close{background:var(--bg);border:none;border-radius:var(--shape-sm);width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:var(--font-size-14);color:var(--muted);font-family:var(--font);flex-shrink:0}.modal-close:hover{color:var(--text)}.modal-body{padding:16px 20px 24px;display:grid;gap:12px;overflow-y:auto;scrollbar-width:thin;min-height:0}.modal-section-label{font-size:var(--font-size-12);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--primary);margin:0}.modal-subtitle{font-size:var(--font-size-14);color:var(--muted);margin:0}.w-modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 20px 20px;flex-shrink:0;border-top:1px solid var(--border)}