dialog.album-dialog {
  --album-paper: var(--paper, #fafafa);
  --album-ink: var(--ink, #000);
  --album-muted: var(--muted, #666);
  --album-line: var(--line, #dedede);
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100dvh;
  max-width: none;
  max-height: none;
  padding: 0;
  margin: 0;
  border: 0;
  color: var(--album-ink);
  background: var(--album-paper);
  font-family: var(--font-ui, sans-serif);
  font-size: 15px;
  line-height: 1.7;
  overflow-y: auto;
  overscroll-behavior: contain;
}
dialog.album-dialog[open] { display: block; }
.album-dialog :is(p, h2, fieldset) { margin: 0; }
.album-dialog :is(button, input, textarea) { font: inherit; color: inherit; }
.album-dialog :is(button, input, textarea, [tabindex]):focus-visible { outline: 2px solid var(--album-ink); outline-offset: 4px; }
.album-dialog-header { display: flex; align-items: start; justify-content: space-between; gap: 24px; padding: max(28px, env(safe-area-inset-top)) clamp(20px, 5vw, 80px) 24px; }
.album-dialog-eyebrow { color: var(--album-muted); font-size: 12px; letter-spacing: .05em; }
.album-dialog .album-dialog-title { margin-top: 18px; font: 30px/1.5 var(--font-art, serif); }
.album-dialog-close { min-width: 44px; min-height: 44px; padding: 8px 0 8px 16px; color: var(--album-muted); font-size: 14px; text-align: right; }
.album-dialog-close:hover { color: var(--album-ink); }
.album-dialog-layout { display: grid; grid-template-columns: minmax(180px, 250px) minmax(0, 480px); gap: clamp(32px, 6vw, 96px); max-width: 1080px; padding: 28px clamp(20px, 5vw, 80px) max(64px, env(safe-area-inset-bottom)); }
.album-dialog-intro { overflow-wrap: anywhere; }
.album-dialog-intro > p + p { margin-top: 20px; }
.album-dialog-small { display: block; color: var(--album-muted); font-size: 13px; line-height: 1.7; }
.album-dialog-content { min-width: 0; }
dialog.album-dialog form.album-dialog-form { position: static; top: auto; right: auto; width: 100%; }
.album-dialog-field { display: grid; gap: 8px; margin-bottom: 24px; }
.album-dialog-field label { font-size: 14px; }
.album-dialog-field :is(input, textarea) { display: block; width: 100%; min-width: 0; min-height: 44px; padding: 10px 12px; border: 1px solid var(--album-line); border-radius: 0; background: transparent; font-size: 16px; line-height: 1.5; }
.album-dialog-field input[type="date"] { min-width: 0; }
.album-dialog-field textarea { resize: vertical; }
.album-dialog-field :is(input, textarea):disabled { opacity: .65; }
.album-dialog-help { color: var(--album-muted); font-size: 13px; line-height: 1.6; }
.album-dialog-field-error { font-size: 13px; }
.album-dialog-field-error:empty { display: none; }
.album-dialog-field [aria-invalid="true"] { border-color: var(--album-ink); border-inline-start-width: 3px; }
.album-dialog-status { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14px; }
.album-dialog-status:not(:empty) { margin-block: 16px; padding: 4px 0 4px 12px; border-left: 2px solid currentColor; }
.album-dialog-actions { display: flex; flex-wrap: wrap; gap: 12px 28px; align-items: center; margin-top: 24px; }
.album-dialog-primary { min-height: 44px; padding: 10px 24px; border: 1px solid var(--album-ink); background: var(--album-ink); color: var(--album-paper) !important; }
.album-dialog-text { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; text-align: left; }
.album-dialog-text:hover { color: var(--album-muted); }
.album-dialog :is(button, input):disabled { cursor: default; }
.album-dialog button:disabled { opacity: .55; }
.album-dialog-lifecycle { margin-top: 48px; padding-top: 20px; border-top: 1px solid var(--album-line); }
.album-dialog-lifecycle button { margin-top: 12px; }
.album-dialog-visibility { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.album-dialog-visibility .album-dialog-text { flex-shrink: 0; margin-top: 0; }
.album-dialog-setting-title { font-size: 14px; }
.album-dialog-removal { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--album-line); }
.album-dialog-choices { min-width: 0; padding: 0; border: 0; }
.album-dialog-choices legend { margin-bottom: 16px; padding: 0; font-size: 14px; }
.album-dialog-choice { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 16px; align-items: center; min-height: 80px; padding: 16px 0; border-top: 1px solid var(--album-line); cursor: pointer; }
.album-dialog-choice:last-child { border-bottom: 1px solid var(--album-line); }
.album-dialog-choice > input { width: 18px; height: 18px; margin: 0; accent-color: var(--album-ink); }
.album-dialog-choice-title { display: block; margin-bottom: 4px; font: 20px/1.5 var(--font-art, serif); overflow-wrap: anywhere; }
.album-dialog-choice-copy { min-width: 0; }
.album-dialog-empty { padding: 20px 0; border-block: 1px solid var(--album-line); color: var(--album-muted); }
.album-dialog-new { margin-top: 28px; }
@media (max-width: 700px) {
  .album-dialog-layout { grid-template-columns: minmax(0, 1fr); gap: 32px; max-width: 560px; padding-top: 12px; }
  .album-dialog .album-dialog-title { font-size: 27px; margin-top: 12px; }
  .album-dialog-intro > p + p { margin-top: 12px; }
  .album-dialog-choice { min-height: 88px; }
}
@media (max-width: 379px) {
  .album-dialog-primary { padding-inline: 18px; }
  .album-dialog-actions { gap: 12px 20px; }
}