/* PostWatch Performance v3 — calm Metro service review and inspector workflow */
.pwp3-host,
.pwp3-dialog {
  --pwp3-navy: var(--pw-navy-950, #0b2037);
  --pwp3-blue: var(--pw-navy-800, #123a62);
  --pwp3-steel: var(--pw-steel-600, #456e91);
  --pwp3-gold: var(--pw-gold-600, #a87920);
  --pwp3-bg: var(--pw-bg, var(--bg, #f4f7fa));
  --pwp3-surface: var(--pw-surface, var(--surface, #fff));
  --pwp3-muted-surface: var(--pw-surface-muted, var(--surface-2, #edf2f7));
  --pwp3-text: var(--pw-text, var(--text, #132235));
  --pwp3-muted: var(--pw-text-muted, var(--text-muted, #506176));
  --pwp3-border: var(--pw-border, var(--border, #d7e0e8));
  --pwp3-success: var(--pw-success, #157347);
  --pwp3-warning: var(--pw-warning, #9a5b00);
  --pwp3-danger: var(--pw-danger, #b42318);
  color: var(--pwp3-text);
}

.pwp3 *,
.pwp3 *::before,
.pwp3 *::after,
.pwp3-dialog *,
.pwp3-dialog *::before,
.pwp3-dialog *::after { box-sizing: border-box; }

.pwp3 { width: min(100%, 1320px); margin-inline: auto; padding-bottom: 48px; }
.pwp3 button,
.pwp3 input,
.pwp3 textarea,
.pwp3-dialog button,
.pwp3-dialog input,
.pwp3-dialog textarea { font: inherit; }
.pwp3 button,
.pwp3-dialog button,
.pwp3-upload { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }

.pwp3-sr-only {
  position: absolute !important; width: 1px !important; height: 1px !important;
  padding: 0 !important; margin: -1px !important; overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important;
}

.pwp3-page-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 24px;
  margin-bottom: 20px;
}
.pwp3-page-head > div { min-width: 0; }
.pwp3-eyebrow {
  margin: 0 0 5px; color: var(--pwp3-steel); font-size: .875rem; line-height: 1.3;
  font-weight: 800; letter-spacing: .075em; text-transform: uppercase;
}
.pwp3 h1 { margin: 0; font-size: clamp(1.85rem, 1.45rem + 1.15vw, 2.6rem); line-height: 1.12; letter-spacing: -.035em; }
.pwp3 h2 { margin: 0; font-size: clamp(1.45rem, 1.2rem + .5vw, 1.85rem); line-height: 1.2; letter-spacing: -.025em; }
.pwp3 h3 { margin: 0; font-size: 1.16rem; line-height: 1.3; }
.pwp3 :is(h1, h2)[tabindex="-1"]:focus { outline: none; }
.pwp3-lead { max-width: 68ch; margin: 8px 0 0; color: var(--pwp3-muted); font-size: 1rem; line-height: 1.6; }

.pwp3-button {
  min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  padding: 10px 16px; border: 1px solid var(--pwp3-border); border-radius: 12px;
  background: var(--pwp3-surface); color: var(--pwp3-text); font-size: .95rem; font-weight: 700;
  line-height: 1.2; cursor: pointer; transition: background-color 160ms ease-out, border-color 160ms ease-out, color 160ms ease-out, box-shadow 160ms ease-out, opacity 160ms ease-out;
}
.pwp3-button svg { width: 19px; height: 19px; flex: 0 0 auto; }
.pwp3-button:hover { border-color: color-mix(in srgb, var(--pwp3-steel) 65%, var(--pwp3-border)); background: var(--pwp3-muted-surface); }
.pwp3-button:active { background: color-mix(in srgb, var(--pwp3-muted-surface) 80%, var(--pwp3-blue)); }
.pwp3-button:focus-visible,
.pwp3 input:focus-visible,
.pwp3 textarea:focus-visible,
.pwp3 summary:focus-visible,
.pwp3-upload:focus-within,
.pwp3-dialog button:focus-visible,
.pwp3-dialog input:focus-visible,
.pwp3-dialog textarea:focus-visible { outline: 3px solid #3b82f6; outline-offset: 3px; }
.pwp3-button:disabled { cursor: not-allowed; opacity: .48; }
.pwp3-button--primary { background: var(--pwp3-blue); color: var(--pw-on-primary, #fff); border-color: var(--pwp3-blue); box-shadow: 0 6px 18px color-mix(in srgb, var(--pwp3-blue) 20%, transparent); }
.pwp3-button--primary:hover { background: color-mix(in srgb, var(--pwp3-blue) 88%, #000); border-color: color-mix(in srgb, var(--pwp3-blue) 88%, #000); }
.pwp3-button--ghost { background: transparent; border-color: transparent; color: var(--pwp3-blue); }
.pwp3-button--danger-quiet { color: var(--pwp3-danger); background: transparent; }
.pwp3-button--compact { min-height: 44px; padding: 8px 12px; font-size: .875rem; }
.pwp3-button.is-loading span::after { content: '  •••'; letter-spacing: .08em; }

.pwp3-controls {
  display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 16px;
  margin-bottom: 20px; padding: 16px; border: 1px solid var(--pwp3-border); border-radius: 16px;
  background: var(--pwp3-surface);
}
.pwp3-field { min-width: 0; display: grid; gap: 7px; }
.pwp3-field > label { font-size: .9rem; font-weight: 750; }
.pwp3-field__helper { margin: 0; color: var(--pwp3-muted); font-size: .875rem; line-height: 1.45; }
.pwp3-field__error,
.pwp3-form-error { margin: 0; color: var(--pwp3-danger); font-size: .88rem; font-weight: 700; }
.pwp3 input[type="month"],
.pwp3 input[type="date"],
.pwp3 input[type="number"],
.pwp3 input[type="search"],
.pwp3 textarea,
.pwp3-dialog input[type="date"],
.pwp3-dialog textarea {
  width: 100%; min-height: 48px; padding: 11px 13px; border: 1px solid var(--pwp3-border);
  border-radius: 12px; background: var(--pwp3-surface); color: var(--pwp3-text); font-size: 1rem;
}
.pwp3 textarea,
.pwp3-dialog textarea { min-height: 108px; resize: vertical; line-height: 1.5; }
.pwp3-tabs { display: flex; gap: 6px; padding: 4px; border-radius: 14px; background: var(--pwp3-muted-surface); }
.pwp3-tab { min-width: 132px; border-color: transparent; background: transparent; }
.pwp3-tab.is-active { border-color: var(--pwp3-border); background: var(--pwp3-surface); color: var(--pwp3-blue); box-shadow: 0 2px 8px rgba(15, 35, 64, .08); }

.pwp3-offline {
  display: flex; align-items: center; gap: 10px; margin-bottom: 18px; padding: 12px 14px;
  border: 1px solid color-mix(in srgb, var(--pwp3-warning) 40%, var(--pwp3-border)); border-radius: 13px;
  background: color-mix(in srgb, var(--pwp3-warning) 10%, var(--pwp3-surface)); color: var(--pwp3-text); font-weight: 650;
}
.pwp3-offline[hidden] { display: none; }
.pwp3-offline svg { width: 20px; height: 20px; color: var(--pwp3-warning); }

.pwp3-receipt-slot { margin-bottom: 18px; }
.pwp3-receipt-slot:empty { display: none; }
.pwp3-receipt {
  display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 12px; align-items: start;
  padding: 14px 16px; border: 1px solid color-mix(in srgb, var(--pwp3-success) 35%, var(--pwp3-border));
  border-radius: 15px; background: color-mix(in srgb, var(--pwp3-success) 8%, var(--pwp3-surface));
}
.pwp3-receipt > svg { width: 26px; height: 26px; color: var(--pwp3-success); }
.pwp3-receipt strong { display: block; }
.pwp3-receipt p { margin: 3px 0 0; color: var(--pwp3-muted); font-size: .875rem; line-height: 1.45; overflow-wrap: anywhere; }
.pwp3-receipt .pwp3-receipt__warning { color: var(--pwp3-warning); font-weight: 700; }

.pwp3-decision {
  margin-bottom: 20px; padding: 18px; border: 1px solid var(--pwp3-border); border-radius: 18px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--pwp3-blue) 6%, var(--pwp3-surface)), var(--pwp3-surface));
}
.pwp3-section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.pwp3-section-head > p { max-width: 52ch; margin: 0; color: var(--pwp3-muted); font-size: .9rem; line-height: 1.5; }
.pwp3-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.pwp3-kpi { min-width: 0; padding: 15px; border: 1px solid var(--pwp3-border); border-radius: 14px; background: var(--pwp3-surface); }
.pwp3-kpi > span { color: var(--pwp3-muted); font-size: .875rem; font-weight: 750; }
.pwp3-kpi > strong { display: block; margin-top: 5px; font-size: 1.6rem; line-height: 1.1; font-variant-numeric: tabular-nums; }
.pwp3-kpi > p { margin: 7px 0 0; color: var(--pwp3-muted); font-size: .875rem; line-height: 1.4; }
.pwp3-kpi--attention { border-left: 4px solid var(--pwp3-warning); }
.pwp3-kpi--critical { border-left: 4px solid var(--pwp3-danger); }
.pwp3-kpi--good { border-left: 4px solid var(--pwp3-success); }

.pwp3-layout { min-height: 560px; display: grid; grid-template-columns: minmax(280px, 340px) minmax(0, 1fr); gap: 18px; align-items: start; }
.pwp3-master,
.pwp3-detail {
  min-width: 0; border: 1px solid var(--pwp3-border); border-radius: 18px; background: var(--pwp3-surface);
}
.pwp3-master { position: sticky; top: 92px; overflow: hidden; }
.pwp3-search { position: relative; padding: 14px 14px 8px; }
.pwp3-search > svg { position: absolute; z-index: 1; top: 29px; left: 29px; width: 19px; height: 19px; color: var(--pwp3-muted); pointer-events: none; }
.pwp3-search input { padding-left: 52px !important; background: var(--pwp3-bg); }
.pwp3-master__count { margin: 0; padding: 4px 16px 10px; color: var(--pwp3-muted); font-size: .875rem; font-weight: 700; }
.pwp3-area-list { display: grid; gap: 2px; padding: 0 8px 10px; max-height: min(66dvh, 720px); overflow-y: auto; scrollbar-width: thin; }
.pwp3-area-card {
  width: 100%; min-height: 78px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center;
  padding: 12px; border: 1px solid transparent; border-radius: 13px; background: transparent;
  color: var(--pwp3-text); text-align: left; cursor: pointer;
}
.pwp3-area-card:hover { background: var(--pwp3-muted-surface); }
.pwp3-area-card.is-selected { border-color: color-mix(in srgb, var(--pwp3-blue) 35%, var(--pwp3-border)); background: color-mix(in srgb, var(--pwp3-blue) 8%, var(--pwp3-surface)); box-shadow: inset 3px 0 0 var(--pwp3-gold); }
.pwp3-area-card__copy { min-width: 0; }
.pwp3-area-card__copy strong,
.pwp3-area-card__copy span { display: block; }
.pwp3-area-card__copy strong { font-size: 1rem; line-height: 1.35; overflow-wrap: anywhere; }
.pwp3-area-card__copy span { margin-top: 4px; color: var(--pwp3-muted); font-size: .875rem; }
.pwp3-area-card__status { display: grid; justify-items: end; gap: 6px; }
.pwp3-area-card__status > svg { width: 17px; height: 17px; color: var(--pwp3-muted); }

.pwp3-pill {
  display: inline-flex; align-items: center; min-height: 28px; padding: 4px 9px; border-radius: 999px;
  background: var(--pwp3-muted-surface); color: var(--pwp3-muted); font-size: .875rem; font-weight: 800; line-height: 1.2; white-space: nowrap;
}
.pwp3-pill--good { background: color-mix(in srgb, var(--pwp3-success) 12%, var(--pwp3-surface)); color: var(--pwp3-success); }
.pwp3-pill--attention { background: color-mix(in srgb, var(--pwp3-warning) 12%, var(--pwp3-surface)); color: var(--pwp3-warning); }
.pwp3-pill--critical { background: color-mix(in srgb, var(--pwp3-danger) 11%, var(--pwp3-surface)); color: var(--pwp3-danger); }
.pwp3-pill--info { background: color-mix(in srgb, var(--pwp3-blue) 10%, var(--pwp3-surface)); color: var(--pwp3-blue); }

.pwp3-detail { padding: clamp(18px, 2.4vw, 28px); }
.pwp3-mobile-back { display: none; margin: -6px 0 12px; }
.pwp3-detail-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding-bottom: 18px; border-bottom: 1px solid var(--pwp3-border); }
.pwp3-detail-head p:last-child { margin: 6px 0 0; color: var(--pwp3-muted); font-size: .92rem; }
.pwp3-score-summary { display: grid; grid-template-columns: auto auto minmax(220px, 1fr); gap: 18px; align-items: center; padding: 22px 0; }
.pwp3-score { text-align: center; }
.pwp3-score__ring {
  --pwp3-score-color: var(--pwp3-blue); width: 112px; height: 112px; display: grid; place-content: center;
  border-radius: 50%; background: radial-gradient(circle closest-side, var(--pwp3-surface) 79%, transparent 80% 99%), conic-gradient(var(--pwp3-score-color) calc(var(--pwp3-score) * 1%), var(--pwp3-muted-surface) 0);
}
.pwp3-score--good .pwp3-score__ring { --pwp3-score-color: var(--pwp3-success); }
.pwp3-score--attention .pwp3-score__ring { --pwp3-score-color: var(--pwp3-warning); }
.pwp3-score--critical .pwp3-score__ring { --pwp3-score-color: var(--pwp3-danger); }
.pwp3-score__ring strong { font-size: 1.65rem; line-height: 1; font-variant-numeric: tabular-nums; }
.pwp3-score__ring span { color: var(--pwp3-muted); font-size: .875rem; }
.pwp3-score > p { margin: 7px 0 0; color: var(--pwp3-muted); font-size: .875rem; font-weight: 700; }
.pwp3-waiting-score { min-height: 112px; width: 140px; display: grid; place-content: center; justify-items: center; gap: 4px; padding: 12px; border: 1px dashed var(--pwp3-border); border-radius: 16px; text-align: center; }
.pwp3-waiting-score svg { width: 25px; height: 25px; color: var(--pwp3-warning); }
.pwp3-waiting-score strong { font-size: .88rem; }
.pwp3-waiting-score p { margin: 0; color: var(--pwp3-muted); font-size: .875rem; line-height: 1.4; }
.pwp3-evidence-summary { padding: 16px; border-radius: 14px; background: var(--pwp3-muted-surface); }
.pwp3-evidence-summary strong { font-size: 1.05rem; }
.pwp3-evidence-summary p { margin: 6px 0 0; color: var(--pwp3-muted); font-size: .875rem; line-height: 1.5; }
.pwp3-evidence-summary .pwp3-pill { margin-top: 8px; }
.pwp3-evidence-note { display: flex; align-items: flex-start; gap: 10px; margin: -6px 0 16px; padding: 12px 14px; border: 1px solid color-mix(in srgb, var(--pwp3-warning) 32%, var(--pwp3-border)); border-radius: 13px; background: color-mix(in srgb, var(--pwp3-warning) 8%, var(--pwp3-surface)); }
.pwp3-evidence-note svg { width: 20px; height: 20px; flex: 0 0 auto; color: var(--pwp3-warning); }
.pwp3-evidence-note p { margin: 0; color: var(--pwp3-muted); font-size: .875rem; line-height: 1.5; }

.pwp3-detail-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); gap: 16px; align-items: start; }
.pwp3-score-groups,
.pwp3-grade-panel,
.pwp3-history,
.pwp3-weekly { border: 1px solid var(--pwp3-border); border-radius: 16px; background: var(--pwp3-surface); }
.pwp3-score-groups { overflow: hidden; }
.pwp3-score-group + .pwp3-score-group { border-top: 1px solid var(--pwp3-border); }
.pwp3-score-group summary { min-height: 68px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(90px, 150px) 20px; gap: 12px; align-items: center; padding: 12px 15px; cursor: pointer; list-style: none; }
.pwp3-score-group summary::-webkit-details-marker { display: none; }
.pwp3-score-group summary strong,
.pwp3-score-group summary small { display: block; }
.pwp3-score-group summary small { margin-top: 3px; color: var(--pwp3-muted); font-size: .875rem; }
.pwp3-score-group summary > svg { width: 18px; height: 18px; transition: transform 180ms ease-out; }
.pwp3-score-group[open] summary > svg { transform: rotate(180deg); }
.pwp3-score-group__bar { height: 7px; overflow: hidden; border-radius: 99px; background: var(--pwp3-muted-surface); }
.pwp3-score-group__bar > span { display: block; height: 100%; border-radius: inherit; background: var(--pwp3-steel); }
.pwp3-score-group__items { padding: 0 15px 13px; }
.pwp3-score-group__items > div { min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-top: 1px solid color-mix(in srgb, var(--pwp3-border) 65%, transparent); color: var(--pwp3-muted); font-size: .875rem; }
.pwp3-score-group__items strong { color: var(--pwp3-text); font-variant-numeric: tabular-nums; }

.pwp3-grade-panel { padding: 16px; }
.pwp3-grade-entry { display: grid; gap: 12px; margin-bottom: 16px; }
.pwp3-grade-entry .pwp3-button { width: 100%; }
.pwp3-readonly-note { margin: 0 0 15px; color: var(--pwp3-muted); line-height: 1.5; }
.pwp3-proof { display: grid; gap: 12px; padding: 14px; border-radius: 14px; background: var(--pwp3-muted-surface); }
.pwp3-proof p { margin: 3px 0 0; color: var(--pwp3-muted); font-size: .875rem; line-height: 1.45; overflow-wrap: anywhere; }
.pwp3-upload { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 10px 13px; border: 1px dashed var(--pwp3-steel); border-radius: 12px; background: var(--pwp3-surface); color: var(--pwp3-blue); font-size: .88rem; font-weight: 750; cursor: pointer; }
.pwp3-upload svg { width: 19px; height: 19px; }
.pwp3-upload input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.pwp3-upload.is-loading { opacity: .55; cursor: wait; }

.pwp3-history { margin-top: 16px; padding: 16px; }
.pwp3-history-list { display: grid; }
.pwp3-history-row { min-height: 48px; display: grid; grid-template-columns: minmax(92px, .7fr) minmax(105px, 1fr) auto; gap: 12px; align-items: center; border-top: 1px solid var(--pwp3-border); font-size: .875rem; }
.pwp3-history-row > span:not(.pwp3-pill) { color: var(--pwp3-muted); }

.pwp3-week-picker { max-width: 360px; padding: 18px 0; }
.pwp3-weekly { overflow: hidden; }
.pwp3-weekly__status { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 16px 18px; background: var(--pwp3-muted-surface); }
.pwp3-weekly__status strong,
.pwp3-weekly__status span { display: block; }
.pwp3-weekly__status span { margin-top: 3px; color: var(--pwp3-muted); font-size: .875rem; }
.pwp3-form-section { min-width: 0; margin: 0; padding: 18px; border: 0; border-top: 1px solid var(--pwp3-border); }
.pwp3-form-section legend { padding: 0; font-size: 1rem; font-weight: 800; }
.pwp3-form-section > p { margin: 5px 0 14px; color: var(--pwp3-muted); font-size: .875rem; }
.pwp3-form-section__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.pwp3-form-section__head legend { float: left; }
.pwp3-stepper { display: grid; grid-template-columns: 48px minmax(120px, 1fr) 48px; gap: 12px; align-items: center; }
.pwp3-stepper .pwp3-button { width: 48px; padding: 0; }
.pwp3-stepper .pwp3-button span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.pwp3-stepper > div { text-align: center; }
.pwp3-stepper__value { display: block; font-size: 1.7rem; line-height: 1; font-variant-numeric: tabular-nums; }
.pwp3-stepper > div span { color: var(--pwp3-muted); font-size: .875rem; }
.pwp3-activity-list { display: grid; gap: 8px; }
.pwp3-empty-line { margin: 0; padding: 14px; border: 1px dashed var(--pwp3-border); border-radius: 12px; color: var(--pwp3-muted); font-size: .875rem; }
.pwp3-activity { min-height: 62px; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid var(--pwp3-border); border-radius: 12px; }
.pwp3-activity strong,
.pwp3-activity span { display: block; }
.pwp3-activity span { margin-top: 2px; color: var(--pwp3-muted); font-size: .875rem; }
.pwp3-check { min-height: 44px; display: flex; align-items: center; gap: 8px; font-size: .875rem; font-weight: 700; cursor: pointer; }
.pwp3-check input,
.pwp3-toggle-row input,
.pwp3-criteria-row input { width: 22px; height: 22px; accent-color: var(--pwp3-blue); }
.pwp3-toggle-row { min-height: 62px; display: flex; align-items: center; gap: 12px; padding: 12px; border: 1px solid var(--pwp3-border); border-radius: 13px; cursor: pointer; }
.pwp3-toggle-row strong,
.pwp3-toggle-row small { display: block; }
.pwp3-toggle-row small { margin-top: 3px; color: var(--pwp3-muted); font-size: .875rem; }
.pwp3-weekly > .pwp3-field { padding: 18px; border-top: 1px solid var(--pwp3-border); }
.pwp3-form-actions { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 18px; border-top: 1px solid var(--pwp3-border); background: var(--pwp3-muted-surface); }
.pwp3-form-actions p { max-width: 60ch; margin: 0; color: var(--pwp3-muted); font-size: .875rem; line-height: 1.45; }

.pwp3-state { min-height: 260px; display: grid; place-content: center; justify-items: center; padding: 28px; text-align: center; }
.pwp3-state > svg { width: 38px; height: 38px; margin-bottom: 12px; color: var(--pwp3-steel); }
.pwp3-state h2 { font-size: 1.25rem; }
.pwp3-state p { max-width: 54ch; margin: 7px 0 16px; color: var(--pwp3-muted); line-height: 1.55; }
.pwp3-state--error > svg { color: var(--pwp3-danger); }
.pwp3-area-list .pwp3-state { min-height: 180px; padding: 20px 12px; }
.pwp3-area-list .pwp3-state h2 { font-size: 1rem; }
.pwp3-area-list .pwp3-state p { font-size: .875rem; }
.pwp3-loading { display: grid; grid-template-columns: minmax(280px, 340px) minmax(0, 1fr); gap: 18px; }
.pwp3-skeleton { min-height: 240px; display: grid; align-content: start; gap: 14px; padding: 20px; border: 1px solid var(--pwp3-border); border-radius: 18px; background: var(--pwp3-surface); }
.pwp3-skeleton__line { height: 16px; border-radius: 99px; background: linear-gradient(90deg, var(--pwp3-muted-surface), color-mix(in srgb, var(--pwp3-muted-surface) 55%, var(--pwp3-surface)), var(--pwp3-muted-surface)); background-size: 220% 100%; animation: pwp3-shimmer 1.4s ease-in-out infinite; }
.pwp3-skeleton__line:nth-child(2n) { width: 78%; }
.pwp3-skeleton__line--title { width: 46%; height: 24px; }
@keyframes pwp3-shimmer { to { background-position: -220% 0; } }

.pwp3-dialog { width: min(92vw, 680px); max-height: min(90dvh, 900px); padding: 0; border: 0; border-radius: 22px; background: transparent; color: var(--pwp3-text); }
.pwp3-dialog::backdrop { background: rgba(5, 14, 25, .58); backdrop-filter: blur(4px); }
.pwp3-dialog__surface { max-height: inherit; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; overflow: hidden; border: 1px solid var(--pwp3-border); border-radius: 22px; background: var(--pwp3-surface); box-shadow: 0 28px 90px rgba(5, 14, 25, .28); }
.pwp3-dialog__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 20px; border-bottom: 1px solid var(--pwp3-border); }
.pwp3-dialog__head h2 { margin: 0; font-size: 1.35rem; }
.pwp3-dialog__head p { margin: 5px 0 0; color: var(--pwp3-muted); font-size: .88rem; line-height: 1.5; }
.pwp3-dialog__body { min-height: 0; max-height: none; overflow-y: auto; padding: 20px; }
.pwp3-dialog__actions { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 20px calc(14px + env(safe-area-inset-bottom)); border-top: 1px solid var(--pwp3-border); background: var(--pwp3-muted-surface); }
.pwp3-dialog-form { display: grid; gap: 16px; }
.pwp3-criteria-form { display: grid; gap: 18px; }
.pwp3-criteria-form fieldset { margin: 0; padding: 0; border: 0; }
.pwp3-criteria-form legend { margin-bottom: 8px; font-size: .875rem; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; color: var(--pwp3-steel); }
.pwp3-criteria-row { min-height: 58px; display: flex; align-items: center; gap: 12px; padding: 9px 11px; border: 1px solid var(--pwp3-border); border-radius: 12px; cursor: pointer; }
.pwp3-criteria-row + .pwp3-criteria-row { margin-top: 7px; }
.pwp3-criteria-row strong,
.pwp3-criteria-row small { display: block; }
.pwp3-criteria-row small { margin-top: 2px; color: var(--pwp3-muted); font-size: .875rem; }
.pwp3-proof-viewer { display: grid; justify-items: center; gap: 14px; text-align: center; }
.pwp3-proof-viewer > img { display: block; max-width: 100%; max-height: 58dvh; border-radius: 14px; object-fit: contain; }
.pwp3-proof-viewer > svg { width: 72px; height: 72px; color: var(--pwp3-steel); }
.pwp3-proof-viewer p { margin: 0; color: var(--pwp3-muted); overflow-wrap: anywhere; }
.pwp3-proof-viewer > a { text-decoration: none; }

@media (max-width: 1023px) {
  .pwp3-layout,
  .pwp3-loading { grid-template-columns: minmax(280px, 320px) minmax(0, 1fr); gap: 14px; }
  .pwp3-detail { padding: 20px; }
  .pwp3-score-summary { grid-template-columns: auto auto; }
  .pwp3-evidence-summary { grid-column: 1 / -1; }
  .pwp3-detail-grid { grid-template-columns: 1fr; }
  .pwp3-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pwp3-history-row { grid-template-columns: minmax(0, 1fr) auto; padding: 10px 0; }
  .pwp3-history-row > span:not(.pwp3-pill) { grid-column: 1; }
  .pwp3-history-row > .pwp3-pill { grid-column: 2; grid-row: 1 / span 2; }
}

@media (max-width: 767px) {
  .pwp3 { padding-bottom: calc(94px + env(safe-area-inset-bottom)); }
  .pwp3-page-head { display: block; margin-bottom: 16px; }
  .pwp3-page-head > .pwp3-pill { margin-top: 10px; }
  .pwp3-lead { font-size: .94rem; }
  .pwp3-controls { display: grid; padding: 12px; }
  .pwp3-controls > .pwp3-field { width: 100%; }
  .pwp3-tabs { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
  .pwp3-tab { min-width: 0; padding-inline: 8px; }
  .pwp3-section-head { display: grid; gap: 7px; }
  .pwp3-kpis { grid-template-columns: 1fr; }
  .pwp3-kpi { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; }
  .pwp3-kpi > strong { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
  .pwp3-kpi > p { grid-column: 1; }
  .pwp3-layout,
  .pwp3-loading { min-height: 0; display: block; }
  .pwp3-loading > * + * { margin-top: 14px; }
  .pwp3-master { position: static; }
  .pwp3-area-list { max-height: none; }
  .pwp3-layout > .pwp3-detail { display: none; }
  .pwp3-layout[data-has-selection="true"] > .pwp3-master { display: none; }
  .pwp3-layout[data-has-selection="true"] > .pwp3-detail { display: block; }
  .pwp3-detail { padding: 16px; border-radius: 16px; }
  .pwp3-mobile-back { display: inline-flex; }
  .pwp3-detail-head { display: grid; }
  .pwp3-detail-head > .pwp3-button { width: 100%; }
  .pwp3-score-summary { grid-template-columns: 1fr 1fr; gap: 12px; }
  .pwp3-score,
  .pwp3-waiting-score { width: 100%; }
  .pwp3-score__ring { width: 104px; height: 104px; margin-inline: auto; }
  .pwp3-form-section__head { align-items: flex-start; }
  .pwp3-activity { grid-template-columns: minmax(0, 1fr) auto; }
  .pwp3-activity > .pwp3-check { grid-column: 1; }
  .pwp3-activity > .pwp3-button { grid-column: 2; grid-row: 1 / span 2; }
  .pwp3-form-actions { display: grid; }
  .pwp3-form-actions .pwp3-button { width: 100%; }
  .pwp3-receipt { grid-template-columns: 28px minmax(0, 1fr); }
  .pwp3-receipt > .pwp3-button { grid-column: 1 / -1; width: 100%; }
  .pwp3-dialog { width: 100%; max-width: none; max-height: 94dvh; margin: auto 0 0; border-radius: 22px 22px 0 0; }
  .pwp3-dialog__surface { border-radius: 22px 22px 0 0; }
  .pwp3-dialog__body { padding: 16px; }
  .pwp3-dialog__head { padding: 16px; }
  .pwp3-dialog__actions { display: grid; grid-template-columns: 1fr 1fr; padding-inline: 16px; }
  .pwp3-dialog__actions .pwp3-button { width: 100%; }
}

@media (max-width: 390px) {
  .pwp3-score-summary { display: grid; grid-template-columns: 1fr 1fr; }
  .pwp3-score__ring { width: 94px; height: 94px; }
  .pwp3-score__ring strong { font-size: 1.45rem; }
  .pwp3-waiting-score { min-height: 100px; }
  .pwp3-score-group summary { grid-template-columns: minmax(0, 1fr) 80px 18px; padding-inline: 12px; }
  .pwp3-stepper { grid-template-columns: 48px minmax(0, 1fr) 48px; gap: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  .pwp3 *,
  .pwp3 *::before,
  .pwp3 *::after,
  .pwp3-dialog *,
  .pwp3-dialog *::before,
  .pwp3-dialog *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

@media (forced-colors: active) {
  .pwp3-button:focus-visible,
  .pwp3 input:focus-visible,
  .pwp3 textarea:focus-visible,
  .pwp3 summary:focus-visible,
  .pwp3-dialog button:focus-visible,
  .pwp3-dialog input:focus-visible,
  .pwp3-dialog textarea:focus-visible { outline-color: Highlight; }
  .pwp3-area-card.is-selected { outline: 2px solid Highlight; }
}