/* Shared progressive-disclosure polish for the bracket calculator and checkers. */

#bracket-deck-form,
#commander-bracket-1-form,
#commander-bracket-2-form,
#commander-bracket-3-form,
#commander-bracket-4-form {
  scroll-margin-top: 24px;
}

.bracket3-page-hero,
.tool-card-feature-bracket {
  padding: clamp(20px, 3vw, 34px);
}

.bracket3-page-hero .page-intro,
.tool-card-feature-bracket .page-intro {
  max-width: 66ch;
}

.bracket3-page-hero .page-title,
.tool-card-feature-bracket .page-title {
  max-width: 24ch;
  margin-block: 6px 10px;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1;
  letter-spacing: -0.035em;
}

.bracket3-tool-shell {
  display: grid;
  gap: 14px;
  padding: clamp(14px, 2vw, 20px);
}

.bracket3-tool-shell .deck-workspace {
  margin: 0;
  border-color: rgba(201, 168, 76, 0.24);
  background: rgba(201, 168, 76, 0.035);
  box-shadow: none;
}

.bracket3-tool-shell .deck-import-panel {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.bracket3-tool-shell .deck-import-or {
  margin-block: 2px;
  color: rgba(208, 201, 225, 0.52);
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.bracket3-tool-shell .deck-import-toggle {
  min-height: 42px;
  padding-inline: 4px;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.bracket3-tool-shell .deck-import-toggle::after {
  content: " +";
}

.bracket3-tool-shell .deck-import-panel:has(.deck-import-paste[hidden]) .deck-import-clear {
  display: none;
}

.bracket3-tool-shell .deck-workspace.is-preloaded + .deck-import-panel .deck-import-main-btn {
  border-color: rgba(201, 168, 76, 0.34);
  background: transparent;
  color: var(--accent-soft, #dec775);
  box-shadow: none;
}

.bracket3-tool-shell .deck-status {
  min-height: 0;
  margin: 0;
  padding: 3px 2px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.bracket3-tool-shell .deck-status.is-success,
.bracket3-tool-shell .deck-status.is-error {
  padding: 10px 12px;
  border: 1px solid currentColor;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.025);
}

.bracket3-result-stack {
  gap: 16px;
}

.bracket3-verdict-card,
.bracket3-why-section,
.bracket3-fix-section {
  box-shadow: none;
}

.bracket3-why-section,
.bracket3-fix-section {
  padding: clamp(16px, 2.4vw, 22px);
}

.bracket3-report-section summary,
.bracket3-more-details > summary,
.deck-workspace--simple summary,
.bracket-import-options > summary,
.bracket-advanced-disclosure > summary,
.bracket-reference-disclosure > summary,
.bracket-result-details > summary {
  outline: none;
}

.bracket3-report-section summary:focus-visible,
.bracket3-more-details > summary:focus-visible,
.deck-workspace--simple summary:focus-visible,
.bracket-import-options > summary:focus-visible,
.bracket-advanced-disclosure > summary:focus-visible,
.bracket-reference-disclosure > summary:focus-visible,
.bracket-result-details > summary:focus-visible {
  box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.28);
}

/* Calculator input. Paste is primary, file and URL imports stay one click away. */

#bracket-deck-form {
  gap: 14px;
}

#bracket-deck-form .deck-textarea {
  min-height: 190px;
}

.bracket-import-options,
.bracket-advanced-disclosure,
.bracket-reference-disclosure,
.bracket-result-details {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.018);
  overflow: hidden;
}

.bracket-import-options > summary,
.bracket-advanced-disclosure > summary,
.bracket-reference-disclosure > summary,
.bracket-result-details > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 48px;
  padding: 12px 14px;
  cursor: pointer;
  color: var(--accent-soft, #dec775);
  font-weight: 750;
  list-style: none;
}

.bracket-import-options > summary::-webkit-details-marker,
.bracket-advanced-disclosure > summary::-webkit-details-marker,
.bracket-reference-disclosure > summary::-webkit-details-marker,
.bracket-result-details > summary::-webkit-details-marker {
  display: none;
}

.bracket-import-options > summary::after,
.bracket-advanced-disclosure > summary::after,
.bracket-reference-disclosure > summary::after,
.bracket-result-details > summary::after {
  content: "+";
  flex: 0 0 auto;
  color: var(--text-2, #aaa6b2);
  font-size: 1.2rem;
  font-weight: 500;
}

.bracket-import-options[open] > summary::after,
.bracket-advanced-disclosure[open] > summary::after,
.bracket-reference-disclosure[open] > summary::after,
.bracket-result-details[open] > summary::after {
  content: "−";
}

.bracket-import-options-body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  padding: 0 14px 14px;
}

.bracket-advanced-card,
.bracket-reference-card-shell {
  padding: 0;
  overflow: hidden;
}

.bracket-advanced-disclosure,
.bracket-reference-disclosure {
  border: 0;
  border-radius: inherit;
  background: transparent;
}

.bracket-advanced-disclosure > summary,
.bracket-reference-disclosure > summary {
  align-items: flex-start;
  padding: 20px clamp(18px, 3vw, 28px);
}

.bracket-advanced-disclosure > summary span,
.bracket-reference-disclosure > summary span {
  display: block;
  color: var(--text-1, #f4f4f5);
  font-size: 1.08rem;
}

.bracket-advanced-disclosure > summary small,
.bracket-reference-disclosure > summary small {
  flex: 1 1 auto;
  color: var(--text-2, #aaa6b2);
  font-weight: 500;
  line-height: 1.45;
}

.bracket-advanced-body,
.bracket-reference-body {
  padding: 0 clamp(18px, 3vw, 28px) clamp(18px, 3vw, 28px);
}

.bracket-reference-body {
  display: grid;
  gap: 16px;
}

/* Calculator result. Conclusion and next action stay visible, evidence is expandable. */

.bracket-result-card {
  gap: 16px;
  box-shadow: none;
}

.bracket-result-conclusion {
  max-width: 60ch;
  margin: 0;
  color: var(--text-1, #f4f4f5);
  font-size: clamp(1.05rem, 2vw, 1.25rem);
  font-weight: 700;
  line-height: 1.45;
}

.bracket-result-priority {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid rgba(201, 168, 76, 0.22);
  background: rgba(201, 168, 76, 0.06);
}

.bracket-result-priority > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.bracket-result-priority span {
  color: var(--text-2, #aaa6b2);
  font-size: 0.7rem;
  font-weight: 750;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.bracket-result-priority strong {
  line-height: 1.4;
}

.bracket-result-priority .primary-link {
  flex: 0 0 auto;
}

.bracket-result-details > .bracket-flag-groups {
  padding: 0 14px 14px;
}

.bracket-result-shell + .deck-toolbar {
  justify-content: flex-start;
}

@media (max-width: 759px) {
  .bracket3-page-hero,
  .tool-card-feature-bracket {
    padding: 20px;
  }

  .bracket3-tool-shell .deck-import-main-btn,
  .bracket3-tool-shell .deck-import-run-btn,
  #bracket-deck-form .deck-submit[type="submit"] {
    width: 100%;
  }

  .bracket-import-options-body {
    grid-template-columns: minmax(0, 1fr);
  }

  .bracket-advanced-disclosure > summary,
  .bracket-reference-disclosure > summary,
  .bracket-result-priority {
    flex-direction: column;
    align-items: stretch;
  }

  .bracket-advanced-disclosure > summary::after,
  .bracket-reference-disclosure > summary::after {
    position: absolute;
    right: 18px;
  }

  .bracket-advanced-disclosure > summary,
  .bracket-reference-disclosure > summary {
    position: relative;
    padding-right: 46px;
  }

  .bracket-result-priority .primary-link {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 420px) {
  .bracket3-tool-shell {
    padding: 12px;
  }

  .bracket3-verdict-stats {
    grid-template-columns: minmax(0, 1fr);
  }

  .bracket3-why-row,
  .bracket3-fix-row {
    padding: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bracket3-page-hero::after,
  .bracket3-tool-shell .deck-import-panel > *,
  .bracket3-tool-shell .deck-status,
  .bracket3-result-stack > * {
    animation: none !important;
  }
}
