:host, .pv-root { all: initial; }           /* runtime §6 rule 1: stop host cascade */
/* font-family is otherwise inherited-only (set once, on .pv-root) -- fine on
   the real hosted page (nothing else there to compete), but a self-hosted
   "light" mount (no Shadow DOM boundary -- e.g. bishamonten's own Branding
   preview) shares the document with a host page that likely has its own bare
   h1/button/input tag-selector font rules. Those have lower specificity than
   this ".pv-root *" universal rule, so this always wins regardless of the
   host page's own CSS, closing that leak for every descendant, not just h1. */
.pv-root, .pv-root * { box-sizing: border-box; font-family: inherit; }
.pv-root {
  display: block;
  font-family: var(--pv-font-family);
  font-size: var(--pv-font-size-base);
  color: var(--pv-color-text);
  background: var(--pv-color-background);
  max-width: var(--pv-max-width);
  margin: 0 auto;
  padding: var(--pv-space-6);
  line-height: 1.5;
}
/* width/height stay as HTML attributes (config.logo.{width,height}) so the
   browser can derive the intrinsic aspect ratio and reserve layout space
   before the image loads; width/height: auto here means that ratio drives
   the box instead of the raw attribute pixel values, so a wide or tall logo
   scales proportionally into the height band rather than being stretched. */
.pv-logo { max-height: 56px; width: auto; height: auto; margin-bottom: var(--pv-space-4); }
.pv-title { font-size: var(--pv-font-size-xl); font-weight: 700; margin: 0 0 var(--pv-space-4); }
.pv-presentation { margin: 0 0 var(--pv-space-4); }
.pv-presentation--footer { margin-top: var(--pv-space-4); }
.pv-presentation h1, .pv-presentation h2, .pv-presentation h3,
.pv-presentation h4, .pv-presentation h5, .pv-presentation h6 {
  margin: 0 0 var(--pv-space-2);
  font-weight: 700;
}
.pv-presentation h1 { font-size: var(--pv-font-size-xl); }
.pv-presentation h2 { font-size: var(--pv-font-size-lg); }
.pv-presentation p, .pv-presentation ul, .pv-presentation ol { margin: 0 0 var(--pv-space-2); }
.pv-presentation a { color: var(--pv-color-primary); text-decoration: underline; }
.pv-section { margin: 0 0 var(--pv-space-6); }
.pv-section__title {
  font-size: var(--pv-font-size-lg); font-weight: 600;
  margin: 0 0 var(--pv-space-3); padding-bottom: var(--pv-space-1);
  border-bottom: 1px solid var(--pv-color-border);
}
.pv-field { margin: 0 0 var(--pv-space-4); }
.pv-statement { white-space: pre-line; margin: 0 0 var(--pv-space-4); }
.pv-statement--heading { font-size: var(--pv-font-size-lg); font-weight: 600; }
.pv-statement--notice {
  padding: var(--pv-space-3); border: 1px solid var(--pv-color-border);
  border-radius: var(--pv-radius); background: #f4f6f8;
}
.pv-field__label { display: block; font-weight: 600; margin-bottom: var(--pv-space-1); }
.pv-field__req { color: var(--pv-color-danger); margin-left: 2px; }
.pv-field__help { font-size: var(--pv-font-size-sm); color: #5b6070; margin: 0 0 var(--pv-space-1); }
.pv-input, .pv-textarea, .pv-select {
  width: 100%; font: inherit; color: inherit;
  padding: var(--pv-space-2) var(--pv-space-3);
  border: 1px solid var(--pv-color-border); border-radius: var(--pv-radius);
  background: #fff;
}
.pv-input:focus, .pv-textarea:focus, .pv-select:focus {
  outline: 2px solid var(--pv-color-primary); outline-offset: 1px; border-color: var(--pv-color-primary);
}
.pv-file-upload__input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.pv-file-upload__selection { display: flex; align-items: stretch; gap: var(--pv-space-2); }
.pv-file-upload__dropzone {
  display: flex; flex: 1; min-width: 0; flex-direction: column; gap: var(--pv-space-1);
  align-items: center; justify-content: center; min-height: 112px;
  padding: var(--pv-space-3); color: var(--pv-color-text); background: #fff;
  border: 1px dashed var(--pv-color-border); border-radius: var(--pv-radius); cursor: pointer;
}
.pv-file-upload__dropzone:hover, .pv-file-upload__dropzone--dragging { border-color: var(--pv-color-primary); background: var(--pv-color-background); }
.pv-file-upload__dropzone:focus { outline: 2px solid var(--pv-color-primary); outline-offset: 1px; }
.pv-file-upload__title { font-weight: 600; }
.pv-file-upload__hint { font-size: var(--pv-font-size-sm); color: #5b6070; }
.pv-file-upload__remove { width: 40px; padding: var(--pv-space-2); color: var(--pv-color-danger); background: #fff; border: 1px solid var(--pv-color-border); border-radius: var(--pv-radius); cursor: pointer; }
.pv-file-upload__remove:hover, .pv-file-upload__remove:focus { border-color: var(--pv-color-danger); }
.pv-file-upload__remove:focus { outline: 2px solid var(--pv-color-danger); outline-offset: 1px; }
.pv-file-upload__remove svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.pv-textarea { min-height: 96px; resize: vertical; }
.pv-choice { display: flex; align-items: flex-start; gap: var(--pv-space-2); margin: var(--pv-space-1) 0; }
.pv-choice input { margin-top: 3px; width: 16px; height: 16px; }
.pv-input--invalid, .pv-textarea--invalid { border-color: var(--pv-color-danger); }
.pv-error { color: var(--pv-color-danger); font-size: var(--pv-font-size-sm); margin-top: var(--pv-space-1); }
.pv-button {
  font: inherit; font-weight: 600; cursor: pointer;
  color: var(--pv-color-on-primary); background: var(--pv-color-primary);
  border: 0; border-radius: var(--pv-radius);
  padding: var(--pv-space-3) var(--pv-space-6); margin-top: var(--pv-space-2);
  min-height: 44px; min-width: 44px;                 /* WCAG 2.5.8 target size */
}
.pv-button:disabled { opacity: .55; cursor: default; }
.pv-button--secondary { color: var(--pv-color-primary); background: transparent; border: 1px solid var(--pv-color-primary); }
.pv-submission-unavailable { margin-top: var(--pv-space-2); }
.pv-success {
  padding: var(--pv-space-6); text-align: center;
  border: 1px solid var(--pv-color-border); border-radius: var(--pv-radius);
}
.pv-success__check { font-size: 40px; }
.pv-honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pv-footer-link {
  display: block; margin-top: var(--pv-space-4);
  font-size: var(--pv-font-size-sm); color: var(--pv-color-primary);
  text-align: center; text-decoration: underline;
}
