/* School Supply — public styles */
:root {
  --sup-primary:   #f59e0b;
  --sup-primary-d: #d97706;
  --sup-amazon:    #ff9900;
  --sup-amazon-d:  #e68a00;
  --sup-surface:   #ffffff;
  --sup-border:    #e5e7eb;
  --sup-muted:     #6b7280;
  --sup-radius:    12px;
  --sup-radius-sm: 8px;
  --sup-shadow:    0 2px 8px rgba(0,0,0,.07);
  --sup-shadow-h:  0 8px 24px rgba(0,0,0,.12);
}

/* ── Layout ─────────────────────────────────────────────── */
.sup-wrap    { background:#fafaf8; min-height:100vh; }
.sup-container { max-width:1280px; margin:0 auto; padding:0 1.25rem; }
.sup-affiliate-disclosure { margin:1rem 0; padding:.75rem .9rem; border:1px solid #fde68a; border-radius:8px; background:#fffbeb; color:#78350f; font-size:.78rem; line-height:1.45; }
.sup-affiliate-disclosure strong { font-weight:900; }

/* ── Hero ───────────────────────────────────────────────── */
.sup-hero { background:linear-gradient(135deg,#1e3a5f 0%,#f59e0b 100%); padding:3.5rem 1.25rem 3rem; text-align:center; color:#fff; }
.sup-hero-inner { max-width:860px; margin:0 auto; }
.sup-hero-icon  { font-size:3rem; margin-bottom:.5rem; }
.sup-hero-title { font-size:clamp(1.75rem,4vw,2.5rem); font-weight:900; margin:0 0 .4rem; }
.sup-hero-sub   { font-size:1.05rem; opacity:.9; margin:0 0 2rem; }

.sup-search-form { width:100%; }
.sup-search-row  { display:flex; flex-wrap:wrap; gap:.5rem; background:rgba(255,255,255,.15); backdrop-filter:blur(8px); border-radius:var(--sup-radius); padding:.5rem; }
.sup-search-field { position:relative; flex:1 1 160px; }
.sup-search-field--wide { flex:2 1 260px; }
.sup-search-icon { position:absolute; left:.75rem; top:50%; transform:translateY(-50%); color:var(--sup-muted); pointer-events:none; }
.sup-search-input,
.sup-search-select { width:100%; padding:.65rem .9rem; border:none; border-radius:var(--sup-radius-sm); font-size:.95rem; outline:none; color:#111; background:#fff; box-sizing:border-box; font-family:inherit; }
.sup-search-input  { padding-left:2.25rem; }
.sup-search-btn    { padding:.65rem 1.5rem; background:var(--sup-amazon); color:#fff; border:none; border-radius:var(--sup-radius-sm); font-weight:700; cursor:pointer; transition:background .15s; }
.sup-search-btn:hover { background:var(--sup-amazon-d); }

/* ── Actions bar ─────────────────────────────────────────── */
.sup-actions-bar { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.5rem 0 .75rem; flex-wrap:wrap; }
.sup-results-meta { font-size:.88rem; color:var(--sup-muted); }
.sup-clear { color:#2563eb; text-decoration:none; }
.sup-clear:hover { text-decoration:underline; }

/* ── Select bar ──────────────────────────────────────────── */
.sup-select-bar { display:flex; align-items:center; justify-content:space-between; gap:1rem; background:#fff8ed; border:1.5px solid #fde68a; border-radius:var(--sup-radius-sm); padding:.75rem 1rem; margin-bottom:1rem; flex-wrap:wrap; font-size:.88rem; font-weight:600; color:#92400e; }
.sup-select-actions { display:flex; gap:.5rem; }

/* ── Product grid ────────────────────────────────────────── */
.sup-grid,
.sup-list-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:1.25rem; padding-bottom:2rem; }

/* ── Product card ────────────────────────────────────────── */
.sup-card { position:relative; background:var(--sup-surface); border:1.5px solid var(--sup-border); border-radius:var(--sup-radius); overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--sup-shadow); transition:box-shadow .2s, transform .2s; }
.sup-card:hover { box-shadow:var(--sup-shadow-h); transform:translateY(-2px); }

.sup-card-check-wrap { position:absolute; top:.6rem; right:.6rem; z-index:2; background:#fff; border-radius:50%; padding:.2rem; box-shadow:0 1px 4px rgba(0,0,0,.15); }
.sup-item-check { width:18px; height:18px; cursor:pointer; accent-color:var(--sup-amazon); }

.sup-card-img { aspect-ratio:4/3; overflow:hidden; background:#f9f9f9; display:flex; align-items:center; justify-content:center; }
.sup-card-img img { width:100%; height:100%; object-fit:contain; transition:transform .3s; }
.sup-card:hover .sup-card-img img { transform:scale(1.04); }
.sup-card-img-placeholder { font-size:3rem; }

.sup-card-body { padding:1rem; display:flex; flex-direction:column; flex:1; }
.sup-tag { display:inline-block; padding:.18rem .55rem; border-radius:50px; font-size:.7rem; font-weight:700; background:#fef3c7; color:#92400e; letter-spacing:.04em; text-transform:uppercase; margin-bottom:.4rem; }
.sup-card-title { font-size:.95rem; font-weight:800; margin:0 0 .35rem; color:#111; line-height:1.35; }
.sup-card-desc  { font-size:.8rem; color:var(--sup-muted); margin:0 0 .6rem; flex:1; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.sup-card-footer { display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin-top:auto; padding-top:.5rem; border-top:1px solid #f3f4f6; }
.sup-price { font-size:1rem; font-weight:900; color:#059669; }

/* ── Buttons ─────────────────────────────────────────────── */
.sup-btn { display:inline-flex; align-items:center; justify-content:center; gap:.4rem; padding:.6rem 1.25rem; border-radius:var(--sup-radius-sm); font-size:.88rem; font-weight:700; cursor:pointer; text-decoration:none; border:2px solid transparent; transition:background .15s,color .15s; white-space:nowrap; }
.sup-btn-primary { background:#2563eb; color:#fff; }
.sup-btn-primary:hover { background:#1d4ed8; color:#fff; }
.sup-btn-outline { background:transparent; color:#2563eb; border-color:#2563eb; }
.sup-btn-outline:hover { background:#eff6ff; }
.sup-btn-amazon  { background:var(--sup-amazon); color:#111; }
.sup-btn-amazon:hover { background:var(--sup-amazon-d); color:#111; }
.sup-btn-danger  { background:#fee2e2; color:#b91c1c; border-color:#fca5a5; }
.sup-btn-sm  { padding:.35rem .8rem; font-size:.8rem; }
.sup-btn-lg  { padding:.8rem 1.75rem; font-size:1rem; }

/* ── Pagination ──────────────────────────────────────────── */
.sup-pagination { display:flex; flex-wrap:wrap; gap:.4rem; justify-content:center; margin:2rem 0; }
.sup-page-btn { display:inline-flex; align-items:center; padding:.4rem .85rem; border-radius:var(--sup-radius-sm); border:1px solid var(--sup-border); background:var(--sup-surface); color:#2563eb; text-decoration:none; font-size:.875rem; transition:background .15s; }
.sup-page-btn:hover { background:#eff6ff; }
.sup-page-btn--active { background:#2563eb; color:#fff; border-color:#2563eb; }

/* ── Empty ───────────────────────────────────────────────── */
.sup-empty { text-align:center; padding:5rem 1rem; }
.sup-empty-icon { font-size:3.5rem; display:block; margin-bottom:.75rem; }
.sup-not-found  { text-align:center; padding:5rem 1rem; }

/* ── Supply list page ────────────────────────────────────── */
.sup-list-wrap { padding-bottom:3rem; }
.sup-breadcrumb { display:flex; flex-wrap:wrap; align-items:center; gap:.35rem; padding:1.25rem 0 0; font-size:.84rem; color:var(--sup-muted); }
.sup-breadcrumb a { color:#2563eb; text-decoration:none; }
.sup-breadcrumb a:hover { text-decoration:underline; }
.sup-breadcrumb i { font-size:.7rem; }

.sup-list-header { display:flex; align-items:flex-start; justify-content:space-between; gap:1.5rem; padding:1.5rem 0 1rem; flex-wrap:wrap; }
.sup-list-title  { font-size:clamp(1.35rem,3vw,1.85rem); font-weight:900; margin:0 0 .5rem; color:#111; }
.sup-list-meta   { display:flex; flex-wrap:wrap; gap:.75rem; font-size:.85rem; color:var(--sup-muted); }
.sup-list-meta span { display:flex; align-items:center; gap:.3rem; }
.sup-add-all-bottom { text-align:center; padding:2rem 0; display:flex; align-items:center; justify-content:center; gap:1rem; flex-wrap:wrap; }
.sup-add-all-bottom p { color:var(--sup-muted); margin:0; }

/* ── Parent builder ──────────────────────────────────────── */
.sup-page-header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:1.5rem 0 1rem; flex-wrap:wrap; }
.sup-page-title  { font-size:1.6rem; font-weight:900; margin:0 0 .25rem; color:#111; }
.sup-page-sub    { color:var(--sup-muted); font-size:.9rem; margin:0; }
.sup-section-title { font-size:1rem; font-weight:800; color:#111; margin:0 0 1rem; display:flex; align-items:center; gap:.5rem; }
.sup-alert { padding:.8rem 1rem; border-radius:var(--sup-radius-sm); margin-bottom:1rem; font-size:.9rem; }
.sup-alert--success { background:#dcfce7; color:#166534; border:1px solid #bbf7d0; }
.sup-alert--error   { background:#fee2e2; color:#991b1b; border:1px solid #fecaca; }

.sup-builder { background:var(--sup-surface); border:1.5px solid var(--sup-border); border-radius:var(--sup-radius); padding:1.5rem; margin-bottom:2rem; }
.sup-builder-details { padding-bottom:1.25rem; border-bottom:1px solid var(--sup-border); }
.sup-builder-details > .sup-builder-panel { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.65rem .8rem; align-items:start; }
.sup-builder-details > .sup-builder-panel > .sup-form-row { display:contents; }
.sup-builder-details .sup-form-group--empty { display:none; }
.sup-builder-details textarea[name="teacher_notes"] { min-height:82px; }
.sup-builder-layout { display:grid; grid-template-columns:minmax(340px, .9fr) minmax(0, 1.35fr); gap:1.5rem; margin-top:1.25rem; align-items:start; }
@media(max-width:860px) { .sup-builder-layout { grid-template-columns:1fr; } }
@media(max-width:980px) { .sup-builder-details > .sup-builder-panel { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:560px) {
  .sup-builder-details > .sup-builder-panel { grid-template-columns:1fr; }
}

.sup-builder-panel { display:flex; flex-direction:column; gap:1rem; }
.sup-form-group { display:flex; flex-direction:column; gap:.3rem; }
.sup-form-row   { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }
@media(max-width:480px) { .sup-form-row { grid-template-columns:1fr; } }
.sup-form-label { font-size:.82rem; font-weight:700; color:#374151; }
.sup-form-label span { color:#dc2626; }
.sup-form-input,
.sup-form-select { padding:.55rem .8rem; border:1.5px solid var(--sup-border); border-radius:var(--sup-radius-sm); font-size:.88rem; outline:none; transition:border-color .15s; box-sizing:border-box; font-family:inherit; color:#111; background:#fff; width:100%; }
.sup-form-input:focus,
.sup-form-select:focus { border-color:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.1); }
.sup-form-note { font-size:.75rem; color:var(--sup-muted); margin:.35rem 0 0; }

.sup-school-results { position:absolute; z-index:50; background:#fff; border:1.5px solid var(--sup-border); border-radius:var(--sup-radius-sm); width:100%; box-shadow:0 4px 16px rgba(0,0,0,.1); max-height:200px; overflow-y:auto; }
.sup-school-result  { display:block; width:100%; padding:.55rem .85rem; background:none; border:none; text-align:left; font-size:.85rem; cursor:pointer; transition:background .12s; }
.sup-school-result:hover { background:#eff6ff; }
.sup-school-list-finder { margin:1.25rem 0; padding:1rem; border:1.5px solid #bfdbfe; border-radius:var(--sup-radius); background:#eff6ff; }
.sup-school-list-finder h2 { margin:0 0 .2rem; color:#1e3a8a; font-size:1.05rem; }
.sup-school-list-finder p { margin:0; color:#475569; font-size:.84rem; }
.sup-school-list-search { display:flex; gap:.6rem; margin-top:.75rem; }
.sup-school-list-search .sup-search-field { flex:1; background:#fff; }
.sup-school-list-results { display:grid; gap:.5rem; margin-top:.75rem; }
.sup-school-list-result { display:flex; align-items:center; justify-content:space-between; gap:.8rem; padding:.65rem .75rem; border:1px solid #dbeafe; border-radius:var(--sup-radius-sm); background:#fff; }
.sup-school-list-result strong,
.sup-school-list-result span,
.sup-school-list-result small { display:block; }
.sup-school-list-result strong { color:#1f2937; font-size:.88rem; }
.sup-school-list-result span { margin-top:.1rem; color:#475569; font-size:.78rem; }
.sup-school-list-result small { margin-top:.15rem; color:#64748b; font-size:.72rem; }
.sup-school-list-contribute { display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin-top:.85rem; padding-top:.85rem; border-top:1px solid #bfdbfe; }
.sup-school-list-contribute strong,
.sup-school-list-contribute span { display:block; }
.sup-school-list-contribute strong { color:#1e3a8a; font-size:.88rem; }
.sup-school-list-contribute span { margin-top:.15rem; color:#475569; font-size:.78rem; }
@media(max-width:560px) {
  .sup-school-list-search,
  .sup-school-list-result,
  .sup-school-list-contribute { align-items:stretch; flex-direction:column; }
  .sup-school-list-contribute .sup-btn { width:100%; }
}

.sup-selected-summary { background:#f9fafb; border:1.5px solid var(--sup-border); border-radius:var(--sup-radius-sm); padding:.85rem; min-height:80px; }
.sup-selected-summary-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:.6rem; }
.sup-selected-badge { background:#2563eb; color:#fff; font-size:.72rem; font-weight:800; padding:.15rem .55rem; border-radius:50px; }
.sup-selected-list  { display:flex; flex-direction:column; gap:.4rem; }
.sup-sel-item { display:flex; align-items:center; gap:.5rem; font-size:.82rem; }
.sup-sel-item img { width:28px; height:28px; object-fit:contain; border-radius:4px; flex-shrink:0; }
.sup-sel-ph   { font-size:1.1rem; flex-shrink:0; }
.sup-sel-title { flex:1; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sup-sel-price { color:#059669; font-size:.78rem; font-weight:700; flex-shrink:0; }
.sup-sel-remove { background:none; border:none; color:var(--sup-muted); cursor:pointer; font-size:.9rem; padding:0; flex-shrink:0; }
.sup-sel-remove:hover { color:#dc2626; }

/* Catalog picker */
.sup-catalog-picker { border:1.5px solid var(--sup-border); border-radius:var(--sup-radius); overflow:hidden; max-height:620px; overflow-y:auto; }
.sup-picker-search-wrap { position:relative; padding:.75rem; border-bottom:1px solid var(--sup-border); background:#f9fafb; }
.sup-picker-search { padding-left:2.2rem !important; }
.sup-picker-category { border-bottom:1px solid var(--sup-border); }
.sup-picker-cat-label { padding:.5rem .85rem; font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--sup-muted); background:#f9fafb; }
.sup-picker-item { display:flex; align-items:center; gap:.65rem; padding:.55rem .85rem; cursor:pointer; transition:background .12s; }
.sup-picker-item:hover { background:#eff6ff; }
.sup-picker-item--checked { background:#dbeafe; }
.sup-picker-check { width:16px; height:16px; flex-shrink:0; accent-color:#2563eb; cursor:pointer; }
.sup-picker-img   { width:32px; height:32px; object-fit:contain; border-radius:4px; flex-shrink:0; }
.sup-picker-img-ph { font-size:1.4rem; flex-shrink:0; }
.sup-picker-item-info  { flex:1; min-width:0; }
.sup-picker-item-title { display:block; font-size:.83rem; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sup-picker-item-price { font-size:.75rem; color:#059669; font-weight:700; }

/* My lists */
.sup-my-lists { margin-top:2rem; }
.sup-my-lists-grid { display:flex; flex-direction:column; gap:.65rem; }
.sup-my-list-card { display:flex; align-items:center; gap:1rem; background:var(--sup-surface); border:1.5px solid var(--sup-border); border-radius:var(--sup-radius-sm); padding:.85rem 1rem; flex-wrap:wrap; }
.sup-my-list-info { flex:1; min-width:0; }
.sup-my-list-info strong { display:block; font-size:.9rem; font-weight:800; }
.sup-my-list-meta { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.2rem; }
.sup-my-list-meta span { font-size:.75rem; color:var(--sup-muted); background:#f3f4f6; padding:.1rem .45rem; border-radius:50px; }
.sup-my-list-actions { display:flex; gap:.4rem; flex-shrink:0; }

/* ── Profile page supply cards ───────────────────────────── */
.lrn-supply-list-cards { display:flex; flex-direction:column; gap:.5rem; margin-bottom:1.25rem; }
.lrn-supply-card { display:flex; align-items:center; gap:.65rem; padding:.65rem .85rem; border:1.5px solid #e5e7eb; border-radius:10px; background:#fff; text-decoration:none; color:inherit; transition:background .12s,border-color .12s; }
.lrn-supply-card:hover { background:#fffbeb; border-color:#fde68a; }
.lrn-supply-card--add  { border-style:dashed; color:#d97706; font-size:.85rem; font-weight:700; justify-content:center; }
.lrn-supply-card--add:hover { background:#fffbeb; }
.lrn-supply-card-icon  { font-size:1.3rem; flex-shrink:0; }
.lrn-supply-card-info  { flex:1; min-width:0; }
.lrn-supply-card-info strong { display:block; font-size:.88rem; font-weight:800; color:#1f2937; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lrn-supply-card-meta  { display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.15rem; }
.lrn-supply-card-meta span { font-size:.72rem; color:#9ca3af; background:#f3f4f6; padding:.1rem .4rem; border-radius:50px; }
.lrn-supply-card-arrow { color:#d1d5db; font-size:.8rem; flex-shrink:0; }

/* ── School detail supply section ────────────────────────── */
.sd-supply-section { margin-bottom:2rem; }
.sd-supply-group { margin-bottom:1rem; }
.sd-supply-group-label { font-size:.75rem; font-weight:800; color:var(--sd-muted, #6b7280); text-transform:uppercase; letter-spacing:.05em; padding:.35rem 0 .4rem; border-bottom:1px solid var(--sd-border, #e5e7eb); margin-bottom:.4rem; }
.sd-supply-item { display:flex; align-items:center; gap:.6rem; padding:.5rem .1rem; font-size:.88rem; color:#2563eb; text-decoration:none; border-bottom:1px solid #f3f4f6; }
.sd-supply-item:last-child { border-bottom:none; }
.sd-supply-item:hover { color:#1d4ed8; }
.sd-supply-item-count { margin-left:auto; font-size:.75rem; color:var(--sd-muted, #6b7280); font-weight:600; background:#f3f4f6; padding:.1rem .5rem; border-radius:50px; }
.sd-supply-cta { display:flex; align-items:center; justify-content:space-between; gap:1rem; background:#fffbeb; border:1.5px solid #fde68a; border-radius:var(--sd-radius-sm, 8px); padding:.85rem 1rem; margin-bottom:1.25rem; flex-wrap:wrap; }
.sd-supply-cta-text { display:flex; align-items:center; gap:.5rem; font-size:.85rem; color:#92400e; }

.sd-supply-official {
  font-size:.65rem;
  font-weight:800;
  background:var(--sd-primary,#2563eb);
  color:#fff;
  padding:.1rem .45rem;
  border-radius:50px;
  flex-shrink:0;
  letter-spacing:.03em;
}

/* ── Toolbar (select all + print) ───────────────────────── */
.sup-toolbar {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: .6rem 0;
  margin-bottom: .5rem;
  border-bottom: 1px solid var(--sup-border);
}
.sup-select-all-label {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  font-size: .85rem;
  font-weight: 600;
  color: #374151;
  cursor: pointer;
  user-select: none;
}
.sup-select-all-check {
  width: 17px;
  height: 17px;
  cursor: pointer;
  accent-color: var(--sup-amazon);
}
.sup-list-header-actions {
  display: flex;
  gap: .65rem;
  flex-wrap: wrap;
  align-items: center;
  flex-shrink: 0;
}
@media (max-width: 600px) {
  .sup-list-header { flex-direction: column; align-items: flex-start; }
  .sup-list-header-actions { width: 100%; }
  .sup-list-header-actions .sup-btn { flex: 1; }
}

/* Rich school-supply requirements */
.sup-teacher-notes {
  margin: 1rem 0;
  padding: .9rem 1rem;
  border: 1px solid #fde68a;
  border-radius: var(--sup-radius-sm);
  background: #fffbeb;
  color: #78350f;
}
.sup-teacher-notes h2 { margin: 0 0 .35rem; font-size: 1rem; }
.sup-teacher-notes p { margin: 0; font-size: .88rem; line-height: 1.5; }
.sup-teacher-notes--optional { border-color: #ddd6fe; background: #f5f3ff; color: #5b21b6; }
.sup-requirements-list { display: flex; flex-direction: column; gap: .8rem; }
.sup-requirement-card {
  display: flex;
  gap: .75rem;
  padding: .9rem;
  border: 1.5px solid var(--sup-border);
  border-radius: var(--sup-radius);
  background: var(--sup-surface);
}
.sup-requirement-card.is-optional { border-color: #ddd6fe; background: #fdfcff; }
.sup-requirement-body { flex: 1; min-width: 0; }
.sup-requirement-heading { display: flex; justify-content: space-between; gap: .7rem; align-items: flex-start; margin-bottom: .65rem; }
.sup-requirement-heading h2 { margin: .15rem 0 0; font-size: 1rem; color: #1f2937; }
.sup-requirement-heading p { margin: .25rem 0 0; color: var(--sup-muted); font-size: .82rem; line-height: 1.4; }
.sup-qty-badge,
.sup-optional-badge { display: inline-flex; padding: .15rem .5rem; border-radius: 50px; font-size: .7rem; font-weight: 800; white-space: nowrap; }
.sup-qty-badge { background: #fef3c7; color: #92400e; }
.sup-optional-badge { background: #ede9fe; color: #6d28d9; }
.sup-style-title { color: #6b7280; font-size: .73rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.sup-style-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .55rem; margin: .45rem 0 .7rem; }
.sup-style-option {
  display: flex;
  align-items: center;
  gap: .5rem;
  min-width: 0;
  padding: .5rem;
  border: 1px solid var(--sup-border);
  border-radius: var(--sup-radius-sm);
  background: #fff;
  cursor: pointer;
}
.sup-style-option:has(input:checked) { border-color: #2563eb; background: #eff6ff; }
.sup-style-option input { flex: 0 0 auto; accent-color: #2563eb; }
.sup-style-option img { width: 42px; height: 42px; object-fit: contain; border-radius: 4px; flex: 0 0 auto; }
.sup-style-option span { min-width: 0; font-size: .8rem; font-weight: 700; overflow-wrap: anywhere; }
.sup-style-option small { display: block; margin-top: .1rem; color: #059669; font-size: .72rem; }
.sup-picker-help { margin: .45rem .75rem; color: var(--sup-muted); font-size: .77rem; line-height: 1.35; }
.sup-requirement-editor { padding: .7rem; border: 1px solid var(--sup-border); border-radius: var(--sup-radius-sm); background: #fff; }
.sup-requirement-editor.is-active { border-color: #2563eb; box-shadow: 0 0 0 2px rgba(37,99,235,.1); }
.sup-requirement-editor-head { display: flex; align-items: center; gap: .5rem; margin-bottom: .55rem; }
.sup-requirement-editor-head strong { flex: 1; font-size: .82rem; }
.sup-requirement-editor-summary { display:flex; flex:1; min-width:0; flex-direction:column; gap:.1rem; }
.sup-requirement-editor-summary strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sup-requirement-editor-summary span { color:var(--sup-muted); font-size:.72rem; font-weight:700; }
.sup-requirement-editor-fields { display:flex; flex-direction:column; gap:.5rem; }
.sup-requirement-editor-foot { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.sup-requirement-editor-row { display: grid; grid-template-columns: minmax(0, 1fr) 74px; gap: .5rem; margin-top: .45rem; }
.sup-requirement-editor textarea { min-height: 58px; resize: vertical; }
.sup-requirement-check { display: inline-flex; align-items: center; gap: .35rem; margin-top: .55rem; color: #5b21b6; font-size: .78rem; font-weight: 700; }
.sup-requirement-select { padding: 0; border: 0; background: transparent; color: #1d4ed8; font-size: .82rem; font-weight: 800; cursor: pointer; }
@media (max-width: 520px) {
  .sup-requirement-card { padding: .7rem; gap: .55rem; }
  .sup-style-options { grid-template-columns: 1fr; }
  .sup-requirement-heading { flex-direction: column; }
  .sup-requirement-buy { width: 100%; }
}