.modal{background:var(--surface);width:100%;max-width:100%;height:100dvh;max-height:100dvh;color:var(--ink);border:0;flex-direction:column;margin:0;padding:0;display:flex}.modal:not([open]){display:none}.modal::backdrop{background:#2a242073}.modal-head{align-items:center;gap:var(--space-3);padding:var(--space-4);border-bottom:1px solid var(--line);display:flex}.modal-head h2{font-size:var(--text-lg);flex:1;margin:0}.modal-x{width:var(--tap);height:var(--tap);color:var(--ink-3);cursor:pointer;border-radius:var(--radius-md);background:0 0;border:0;font-size:28px;line-height:1}.modal-x:hover{background:var(--sunk)}.modal-body{padding:var(--space-4);flex:1;overflow-y:auto}.modal-foot{gap:var(--space-2);padding:var(--space-3) var(--space-4);padding-bottom:max(var(--space-3), env(safe-area-inset-bottom));border-top:1px solid var(--line);flex-wrap:wrap;justify-content:flex-end;display:flex}@media (width>=700px){.modal{border-radius:var(--radius-card);width:min(640px,92vw);height:fit-content;max-height:88dvh;margin:auto}.modal.wide{width:min(980px,94vw)}}