.extra-note-dialog{box-sizing:border-box;width:min(900px,calc(100% - 24px));max-height:calc(100dvh - 24px);padding:24px;border:1px solid #ddcec2;border-radius:18px;background:#fffbf8;color:#302b27;overflow:auto}
.extra-note-dialog::backdrop{background:rgba(40,30,25,.5)}
.extra-note-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.extra-note-heading h2{margin:0}.extra-note-dialog .field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}
.extra-note-dialog input,.extra-note-dialog textarea{box-sizing:border-box;width:100%;font:inherit;padding:12px;border:1px solid #cdbbac;border-radius:10px;background:white;color:#302b27}
.extra-note-dialog textarea{resize:vertical;min-height:150px}.extra-note-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:24px}
.extra-note-preview img{display:block;width:100%;height:auto;border:1px solid #ddcec2;background:white}.extra-note-dialog [hidden]{display:none!important}
.extra-note-dialog .actions{display:flex;flex-wrap:wrap;gap:10px}.extra-note-dialog .btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;padding:12px 16px;border-radius:12px;background:#e9dfd3;color:#302b27;font-weight:700}
.extra-note-dialog [data-note-status]{overflow-wrap:anywhere}.extra-note-dialog button{min-height:44px}
@media(max-width:600px){.extra-note-dialog{padding:16px}.extra-note-layout{grid-template-columns:minmax(0,1fr)}.extra-note-preview{max-width:320px;margin:auto}}