.survey-processes{--sp-ink:var(--bs-heading-color,#35415a);--sp-muted:var(--bs-secondary-color,#697386);--sp-line:var(--bs-border-color,#e4e8f0);--sp-card:var(--bs-card-bg,#fff);max-width:1500px;min-width:0}
.sp-header{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:8px 0 26px}.sp-eyebrow{color:var(--bs-primary,#696cff);font-weight:600;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px}.sp-header h1{font-size:clamp(1.65rem,2.3vw,2.3rem);letter-spacing:-.04em;color:var(--sp-ink);margin:0 0 10px}.sp-header p,.sp-results-head p{color:var(--sp-muted);margin:0}.sp-header button{flex-shrink:0}
.sp-links{display:flex;align-items:center;flex-wrap:wrap;gap:20px;margin-bottom:22px;font-size:.88rem}.sp-links a{color:var(--sp-muted)}.sp-current{font-weight:600;color:var(--bs-primary,#696cff);border-bottom:2px solid currentColor;padding:10px 0}.sp-panel{background:var(--sp-card);border:1px solid var(--sp-line);border-radius:14px;box-shadow:0 3px 10px rgba(28,44,78,.025)}.sp-filters{padding:20px;margin-bottom:18px}.sp-filters form{display:grid;grid-template-columns:1fr 1fr 1.2fr 1.4fr auto;gap:14px;align-items:end}.sp-filters form>div{min-width:0}.sp-filters label{display:block;font-size:.78rem;font-weight:600;margin-bottom:7px}.sp-filters input,.sp-filters select{width:100%;min-width:0}.sp-scope{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:16px;font-size:.74rem;color:var(--sp-muted)}
.sp-notice{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--sp-line);border-left:3px solid #d29b31;background:rgba(210,155,49,.06);padding:16px 18px;border-radius:10px;margin-bottom:20px}.sp-notice>i{font-size:1.35rem;margin-top:2px;color:#c68a20}.sp-notice strong{font-size:.9rem}.sp-notice p{font-size:.84rem;line-height:1.6;margin:4px 0 0;color:var(--sp-muted)}.sp-notice.sp-error{border-left-color:#d34d58;background:rgba(211,77,88,.06)}
.sp-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:24px}.sp-metric{padding:20px;display:flex;flex-direction:column;align-items:flex-start;gap:8px}.sp-metric>span:not(.sp-metric-icon){font-size:.85rem;font-weight:600;color:var(--sp-muted)}.sp-metric strong{font-size:2.1rem;line-height:1.25;letter-spacing:-.04em;color:var(--sp-ink)}.sp-metric small{font-size:.73rem;color:var(--sp-muted)}.sp-metric-icon{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:1.2rem;margin-bottom:4px}.sp-indigo{background:rgba(105,108,255,.1);color:#696cff}.sp-blue{background:rgba(37,137,198,.1);color:#2589c6}.sp-green{background:rgba(32,148,113,.1);color:#209471}.sp-amber{background:rgba(190,131,27,.1);color:#be831b}
.sp-results{overflow:hidden}.sp-results-head{padding:22px;display:flex;justify-content:space-between;gap:16px;align-items:center}.sp-results-head h2{font-size:1.08rem;margin:0 0 6px}.sp-results-head p{font-size:.82rem}.sp-readonly{font-size:.75rem;color:var(--sp-muted);white-space:nowrap}.sp-column-head,.sp-row{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:20px;padding:16px 22px}.sp-column-head{font-size:.69rem;font-weight:600;text-transform:uppercase;letter-spacing:.045em;background:rgba(120,130,150,.05);color:var(--sp-muted);border-block:1px solid var(--sp-line)}.sp-row{border-bottom:1px solid var(--sp-line);align-items:start;font-size:.82rem}.sp-row>div{min-width:0;overflow-wrap:anywhere}.sp-row strong,.sp-row small{display:block}.sp-row small{font-size:.74rem;color:var(--sp-muted);line-height:1.6;margin-top:5px}.sp-row-label{display:none}.sp-state{display:inline-block;font-size:.74rem;font-weight:600;border-radius:6px;padding:5px 8px;background:rgba(105,108,255,.09);color:var(--sp-ink)}
.sp-empty{text-align:center;padding:48px 20px 54px;max-width:580px;margin:auto}.sp-empty>i{display:inline-block;font-size:2rem;padding:14px;border-radius:16px;background:rgba(105,108,255,.06);color:var(--bs-primary,#696cff);margin-bottom:17px}.sp-empty h3{font-size:1.1rem;margin-bottom:10px}.sp-empty p{font-size:.86rem;line-height:1.7;color:var(--sp-muted);margin:0}.sp-pagination{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 22px;color:var(--sp-muted);font-size:.78rem}.sp-footnote{font-size:.75rem;color:var(--sp-muted);line-height:1.7;margin:16px 4px}#spMore[hidden],.sp-empty[hidden],.sp-notice[hidden]{display:none!important}
@media(max-width:1100px){.sp-filters form{grid-template-columns:repeat(2,minmax(0,1fr))}.sp-filters button{grid-column:1/-1}.sp-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.sp-header{align-items:flex-start;flex-direction:column;gap:14px}.sp-header button{width:100%}.sp-links{gap:12px;font-size:.8rem}.sp-filters{padding:16px}.sp-filters form{grid-template-columns:minmax(0,1fr)}.sp-metrics{gap:10px}.sp-metric{padding:14px}.sp-metric strong{font-size:1.8rem}.sp-metric small{line-height:1.5}.sp-results-head{padding:18px;align-items:flex-start}.sp-column-head{display:none}.sp-row{grid-template-columns:1fr;padding:18px;gap:14px}.sp-row-label{display:block;font-size:.67rem;text-transform:uppercase;letter-spacing:.06em;color:var(--sp-muted);margin-bottom:4px}.sp-empty{padding:32px 18px}.sp-readonly{font-size:.7rem}.sp-pagination{padding:14px;flex-wrap:wrap}}

/* Theme tokens are local: Bootstrap defines card backgrounds on .card,
   not on the page root. Keep both theme variants explicit here. */
.survey-processes {
  --sp-ink: #334155;
  --sp-muted: #626f83;
  --sp-line: #dce2ec;
  --sp-card: #fff;
  --sp-field: #f8f9fc;
  --sp-accent: #5558d9;
  color: var(--sp-ink);
  max-width: 1440px;
}
.dark-style .survey-processes,
[data-bs-theme="dark"] .survey-processes {
  --sp-ink: #e7e9f4;
  --sp-muted: #b0b7cf;
  --sp-line: #43465e;
  --sp-card: #2b2c40;
  --sp-field: #252638;
  --sp-accent: #b1afff;
  color-scheme: dark;
}
.survey-processes .sp-header { margin: 0 0 18px; gap: 18px; }
.survey-processes .sp-eyebrow { color: var(--sp-accent); font-size: .7rem; margin-bottom: 6px; letter-spacing: .1em; }
.survey-processes .sp-header h1 { font-size: clamp(1.55rem, 2vw, 1.95rem); margin-bottom: 6px; font-weight: 600; }
.survey-processes .sp-header p { font-size: .88rem; line-height: 1.5; }
.survey-processes .sp-links { gap: 6px; padding: 5px; margin-bottom: 18px; border: 1px solid var(--sp-line); border-radius: 10px; background: var(--sp-card); width: fit-content; max-width: 100%; }
.survey-processes .sp-links > * { padding: 9px 13px; border: 0; border-radius: 6px; font-size: .8rem; }
.survey-processes .sp-current { background: rgba(105,108,255,.15); color: var(--sp-accent); }
.survey-processes .sp-links a:hover { color: var(--sp-ink); background: rgba(120,130,150,.1); }
.survey-processes .sp-panel { border-radius: 10px; box-shadow: 0 2px 6px rgba(15,23,42,.035); }
.survey-processes .sp-filters { padding: 16px 18px 12px; margin-bottom: 14px; }
.survey-processes .sp-filters form { gap: 12px; }
.survey-processes .sp-filters label { color: var(--sp-ink); font-size: .75rem; margin-bottom: 6px; }
.survey-processes .form-control,
.survey-processes .form-select { background-color: var(--sp-field); color: var(--sp-ink); border-color: var(--sp-line); font-size: .82rem; min-height: 38px; }
.survey-processes .form-control:focus,
.survey-processes .form-select:focus { border-color: var(--sp-accent); box-shadow: 0 0 0 3px rgba(105,108,255,.18); }
.survey-processes .btn-outline-primary { color: var(--sp-accent); border-color: var(--sp-accent); }
.survey-processes .btn-outline-primary:hover { color: #fff; background: #5558d9; border-color: #5558d9; }
.survey-processes .sp-scope { padding-top: 10px; margin-top: 12px; border-top: 1px solid var(--sp-line); font-size: .7rem; }
.survey-processes .sp-notice { padding: 12px 16px; margin-bottom: 14px; border-radius: 8px; }
.survey-processes .sp-notice p { margin-top: 2px; font-size: .8rem; }
.survey-processes .sp-notice.sp-error > i { color: #e46c7a; }
.survey-processes .sp-metrics { gap: 12px; margin-bottom: 18px; }
.survey-processes .sp-metric { position: relative; padding: 17px 18px; gap: 6px; }
.survey-processes .sp-metric > span:not(.sp-metric-icon) { color: var(--sp-ink); padding-right: 35px; min-height: 30px; font-size: .8rem; line-height: 1.35; }
.survey-processes .sp-metric-icon { position: absolute; right: 14px; top: 14px; width: 29px; height: 29px; border-radius: 8px; font-size: 1.05rem; }
.survey-processes .sp-indigo { color: var(--sp-accent); background: rgba(105,108,255,.14); }
.survey-processes .sp-metric strong { font-size: 1.9rem; line-height: 1.1; }
.survey-processes .sp-metric small { line-height: 1.45; font-size: .71rem; }
.survey-processes .sp-results-head { padding: 17px 20px; }
.survey-processes .sp-results-head h2,
.survey-processes .sp-empty h3 { color: var(--sp-ink); font-weight: 600; }
.survey-processes .sp-results-head h2 { font-size: 1rem; }
.survey-processes .sp-readonly { padding: 5px 9px; background: var(--sp-field); border: 1px solid var(--sp-line); border-radius: 6px; }
.survey-processes .sp-column-head { background: var(--sp-field); padding: 12px 20px; }
.survey-processes .sp-row { padding: 16px 20px; }
.survey-processes .sp-row:hover { background: rgba(120,130,150,.045); }
.survey-processes .sp-empty { padding: 30px 20px; }
.survey-processes .sp-empty > i { font-size: 1.6rem; padding: 11px; margin-bottom: 12px; color: var(--sp-accent); }
.survey-processes .sp-empty h3 { font-size: 1rem; margin-bottom: 7px; }
.survey-processes .sp-pagination { padding: 12px 20px; }
.survey-processes .sp-footnote { font-size: .7rem; margin-top: 12px; }
.survey-processes a:focus-visible,
.survey-processes button:focus-visible { outline: 2px solid var(--sp-accent); outline-offset: 3px; }
@media (max-width: 600px) {
  .survey-processes .sp-header { flex-direction: row; align-items: center; flex-wrap: wrap; }
  .survey-processes .sp-header button { width: auto; }
  .survey-processes .sp-links { width: 100%; gap: 3px; }
  .survey-processes .sp-links > * { padding: 8px; font-size: .74rem; }
  .survey-processes .sp-filters { padding: 14px; }
  .survey-processes .sp-metric { padding: 14px 12px; }
  .survey-processes .sp-metric-icon { position: static; margin-bottom: 2px; }
  .survey-processes .sp-metric > span:not(.sp-metric-icon) { padding-right: 0; min-height: 34px; }
  .survey-processes .sp-results-head { flex-wrap: wrap; padding: 16px; }
  .survey-processes .sp-row { padding: 16px; }
}