.sto-app {
  --sto-ink: #183139;
  --sto-muted: #607278;
  --sto-teal: #11757b;
  --sto-teal-dark: #0b555b;
  --sto-coral: #e37355;
  --sto-sand: #f4efe5;
  --sto-line: #d7dfdd;
  --sto-white: #fff;
  color: var(--sto-ink);
  font-family: inherit;
  line-height: 1.55;
  margin: 24px auto;
  max-width: 1240px;
}

.sto-app *, .sto-app *::before, .sto-app *::after { box-sizing: border-box; }
.sto-app button, .sto-app input, .sto-app select, .sto-app textarea { font: inherit; }
.sto-app button, .sto-app a { -webkit-tap-highlight-color: transparent; }

.sto-hero {
  background: linear-gradient(135deg, #0b555b 0%, #11757b 62%, #3f9392 100%);
  border-radius: 24px;
  color: #fff;
  overflow: hidden;
  padding: clamp(28px, 5vw, 64px);
  position: relative;
}

.sto-hero::after {
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 50%;
  content: "";
  height: 330px;
  position: absolute;
  right: -90px;
  top: -155px;
  width: 330px;
}

.sto-hero h2 { color: inherit; font-size: clamp(2rem, 5vw, 4.4rem); letter-spacing: -.045em; line-height: 1; margin: 6px 0 18px; max-width: 820px; }
.sto-hero p { font-size: 1.05rem; margin: 0; max-width: 720px; opacity: .9; }
.sto-kicker, .sto-eyebrow { font-size: .74rem !important; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.sto-kicker { opacity: .76 !important; }
.sto-eyebrow { color: var(--sto-teal); margin: 0 0 4px !important; }

.sto-tabs { align-items: center; border-bottom: 1px solid var(--sto-line); display: flex; gap: 4px; margin: 26px 0 0; overflow-x: auto; }
.sto-tab { background: transparent; border: 0; border-bottom: 3px solid transparent; color: var(--sto-muted); cursor: pointer; font-weight: 750; padding: 14px 18px 12px; white-space: nowrap; }
.sto-tab.is-active { border-color: var(--sto-coral); color: var(--sto-ink); }

.sto-panel { padding: 32px 0; }
.sto-panel-heading { align-items: end; display: flex; gap: 24px; justify-content: space-between; margin-bottom: 24px; }
.sto-panel-heading h3 { color: var(--sto-ink); font-size: clamp(1.6rem, 3vw, 2.35rem); letter-spacing: -.03em; margin: 0; }
.sto-panel-heading > p { color: var(--sto-muted); margin: 0; max-width: 520px; text-align: right; }

.sto-filters, .sto-builder { background: #f8faf9; border: 1px solid var(--sto-line); border-radius: 18px; display: grid; gap: 16px; padding: 20px; }
.sto-filters { align-items: end; grid-template-columns: minmax(240px, 2fr) minmax(145px, .85fr) minmax(165px, 1fr) minmax(145px, .85fr) minmax(145px, .85fr) auto; }
.sto-filters > * { min-width: 0; }
.sto-filters label, .sto-filters input, .sto-filters select { max-width: 100%; min-width: 0; }
.sto-filters .sto-button { white-space: nowrap; }
.sto-app label { color: var(--sto-ink); display: grid; font-weight: 650; gap: 6px; }
.sto-app label > span, .sto-app legend { font-size: .78rem; letter-spacing: .02em; }
.sto-app input, .sto-app select, .sto-app textarea { background: var(--sto-white); border: 1px solid #bfcac8; border-radius: 10px; color: var(--sto-ink); min-height: 44px; padding: 10px 12px; width: 100%; }
.sto-app textarea { line-height: 1.55; resize: vertical; }
.sto-app input:focus, .sto-app select:focus, .sto-app textarea:focus { border-color: var(--sto-teal); box-shadow: 0 0 0 3px rgba(17,117,123,.13); outline: none; }

.sto-button, .sto-secondary, .sto-danger { align-items: center; border-radius: 10px; cursor: pointer; display: inline-flex; font-weight: 750; justify-content: center; min-height: 44px; padding: 10px 17px; text-decoration: none !important; }
.sto-button { background: var(--sto-teal); border: 1px solid var(--sto-teal); color: #fff; }
.sto-button:hover { background: var(--sto-teal-dark); border-color: var(--sto-teal-dark); color: #fff; }
.sto-secondary { background: var(--sto-white); border: 1px solid #aebcba; color: var(--sto-ink); }
.sto-danger { background: #fff6f4; border: 1px solid #c8513f; color: #9e3223; }
.sto-button:disabled, .sto-secondary:disabled { cursor: wait; opacity: .55; }

.sto-news-grid { display: grid; gap: 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 24px; }
.sto-news-card { background: var(--sto-white); border: 1px solid var(--sto-line); border-radius: 16px; display: flex; flex-direction: column; min-height: 260px; padding: 20px; }
.sto-card-meta { display: flex; flex-wrap: wrap; gap: 7px; }
.sto-card-meta span { background: var(--sto-sand); border-radius: 999px; color: #505b5d; font-size: .7rem; font-weight: 750; padding: 5px 9px; }
.sto-news-card h4 { font-size: 1.14rem; line-height: 1.27; margin: 16px 0 10px; }
.sto-news-card h4 a { color: var(--sto-ink); text-decoration: none; }
.sto-news-card h4 a:hover { color: var(--sto-teal); text-decoration: underline; text-underline-offset: 3px; }
.sto-news-card > p { color: var(--sto-muted); font-size: .92rem; margin: 0 0 18px; }
.sto-news-card footer { border-top: 1px solid #edf0ef; color: var(--sto-muted); display: flex; font-size: .72rem; gap: 10px; justify-content: space-between; margin-top: auto; padding-top: 12px; }
.sto-pick { align-items: center; border-top: 1px solid #edf0ef; display: flex !important; font-size: .78rem; gap: 8px !important; margin-top: 12px; padding-top: 12px; }
.sto-pick input { min-height: 0; width: auto; }

.sto-pagination { align-items: center; display: flex; gap: 14px; justify-content: center; margin-top: 24px; }
.sto-loading, .sto-empty { background: #f8faf9; border: 1px dashed #bbc8c5; border-radius: 14px; color: var(--sto-muted); grid-column: 1 / -1; padding: 36px; text-align: center; }
.sto-notice { border-radius: 12px; margin-top: 16px; padding: 13px 16px; }
.sto-notice.is-error, .sto-error { background: #fff3f0; color: #9e3223; }

.sto-builder { gap: 22px; }
.sto-builder-grid { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sto-builder fieldset { border: 0; margin: 0; padding: 0; }
.sto-builder legend { font-weight: 800; margin-bottom: 10px; }
.sto-check-grid { display: grid; gap: 8px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sto-check-grid label { align-items: start; background: var(--sto-white); border: 1px solid var(--sto-line); border-radius: 10px; display: flex; font-size: .82rem; gap: 8px; padding: 9px 10px; }
.sto-check-grid input { min-height: 0; margin-top: 3px; width: auto; }
.sto-builder > .sto-button { justify-self: start; }

.sto-report-output, .sto-dossier, .sto-draft-editor { background: var(--sto-white); border: 1px solid var(--sto-line); border-radius: 18px; margin-top: 24px; padding: clamp(18px, 3vw, 30px); }
.sto-report-title { align-items: start; display: flex; gap: 20px; justify-content: space-between; }
.sto-report-title h4, .sto-dossier h4, .sto-draft-editor h4 { font-size: 1.45rem; margin: 0 0 14px; }
.sto-report-tables { display: grid; gap: 22px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 22px 0; }
.sto-app table { border-collapse: collapse; font-size: .88rem; width: 100%; }
.sto-app caption { font-size: .9rem; font-weight: 800; padding-bottom: 8px; text-align: left; }
.sto-app th, .sto-app td { border-bottom: 1px solid #e5eae8; padding: 9px; text-align: left; }
.sto-app td { color: var(--sto-muted); }
.sto-table-wrap { overflow-x: auto; }
.sto-footnote { color: var(--sto-muted); font-size: .74rem; }
.sto-source-list li { margin-bottom: 8px; }
.sto-source-list span { color: var(--sto-muted); display: block; font-size: .76rem; }

.sto-saved-section { margin-top: 30px; }
.sto-saved-section h4 { font-size: 1.2rem; margin-bottom: 12px; }
.sto-saved-card { align-items: center; border-bottom: 1px solid var(--sto-line); display: flex; gap: 18px; justify-content: space-between; padding: 13px 4px; }
.sto-saved-card div:first-child { display: grid; gap: 3px; }
.sto-saved-card small, .sto-muted { color: var(--sto-muted); }
.sto-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 9px; }
.sto-link-button, .sto-link-danger { background: transparent; border: 0; cursor: pointer; font-weight: 750; padding: 5px; }
.sto-link-button { color: var(--sto-teal); }
.sto-link-danger { color: #a23b2b; }

.sto-editorial-selection { align-items: center; background: var(--sto-sand); border-radius: 12px; display: flex; justify-content: space-between; margin-bottom: 16px; padding: 12px 16px; }
.sto-dossier ol { color: var(--sto-muted); }
.sto-dossier textarea[readonly] { background: #f3f6f5; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: .78rem; }
.sto-dossier > label, .sto-draft-editor > label { margin-top: 16px; }

@media (max-width: 1050px) {
  .sto-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sto-news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sto-check-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .sto-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sto-filters .sto-button { width: 100%; }
}

@media (max-width: 700px) {
  .sto-app { margin: 12px auto; }
  .sto-hero { border-radius: 16px; padding: 28px 20px; }
  .sto-hero h2 { font-size: 2.25rem; }
  .sto-tabs { margin-top: 16px; }
  .sto-tab { flex: 0 0 auto; padding-inline: 13px; }
  .sto-panel { padding-top: 24px; }
  .sto-panel-heading { align-items: start; display: grid; gap: 8px; }
  .sto-panel-heading > p { text-align: left; }
  .sto-filters, .sto-builder-grid, .sto-report-tables { grid-template-columns: minmax(0, 1fr); }
  .sto-news-grid { grid-template-columns: 1fr; }
  .sto-check-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sto-saved-card, .sto-report-title { align-items: start; flex-direction: column; }
  .sto-actions .sto-button, .sto-actions .sto-secondary, .sto-actions .sto-danger { flex: 1 1 100%; }
}

@media (max-width: 430px) {
  .sto-check-grid { grid-template-columns: 1fr; }
  .sto-filters, .sto-builder, .sto-report-output, .sto-dossier, .sto-draft-editor { border-radius: 13px; padding: 15px; }
  .sto-pagination { flex-wrap: wrap; }
}

