/* Theme: purple header, tabbed streams, table rows with soft cards */
:root{
  --ssc-purple:#5b2bd7;
  --ssc-purple-100:#ede9fe;
  --ssc-purple-200:#ddd6fe;
  --ssc-text:#111827;
  --ssc-muted:#6b7280;
  --ssc-border:#e5e7eb;
}
.ssc-block{font-family:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; color:var(--ssc-text)}
.ssc-header{background:var(--ssc-purple); padding:18px 22px; border-radius:6px; margin-bottom:14px}
.ssc-header h1{margin:0; color:#fff; font-weight:800; font-size:28px; text-align:center}
.ssc-tabs{display:flex; gap:14px; margin-bottom:14px; justify-content:flex-start}
.ssc-tab{flex:0 0 auto; border:1px solid var(--ssc-purple-200); background:var(--ssc-purple-100); color:var(--ssc-purple); padding:10px 16px; border-radius:8px; cursor:pointer; font-weight:600}
.ssc-tab.is-active{background:#fff; border-color:var(--ssc-purple); box-shadow:0 1px 2px rgba(0,0,0,.04)}
.ssc-card{background:#fff; border:1px solid var(--ssc-border); border-radius:10px; padding:14px; box-shadow:0 6px 18px rgba(2,6,23,.06)}
.ssc-table{width:100%; border-collapse:separate; border-spacing:0 10px}
.ssc-table thead th{font-size:14px; color:#374151; text-align:left}
.ssc-row{background:#f8fafc; border:1px solid #e5e7eb; border-radius:10px}
.ssc-row td{padding:10px}
.ssc-code{width:84px; text-align:center; background:#f3f4f6; border-radius:8px; padding:8px 10px; font-weight:700}
.ssc-subject{font-weight:700}
.ssc-select{width:100%; border:1px solid #cbd5e1; border-radius:10px; padding:8px 10px; background:#fff}
.ssc-arrow{background:#f3f4f6; border:1px solid #e5e7eb; border-radius:10px; width:44px; height:36px}
.ssc-optional{border:1px solid var(--ssc-purple-200); background:var(--ssc-purple-100); border-radius:10px; padding:6px 8px; margin-top:6px}
.ssc-optional__title{text-align:center; color:var(--ssc-purple); font-weight:700; margin:4px 0 8px}
.ssc-table--inner{border-spacing:0}
.ssc-help{color:var(--ssc-muted); font-size:13px; margin:10px 2px}
.ssc-actions{display:flex; justify-content:center; padding-top:4px}
.ssc-btn{appearance:none; border:1px solid var(--ssc-purple); color:#fff; background:var(--ssc-purple); border-radius:10px; padding:12px 22px; font-weight:800; cursor:pointer}
.ssc-btn--primary{box-shadow:0 4px 12px rgba(91,43,215,.25)}
.ssc-result{display:flex; gap:10px; align-items:center; justify-content:center; background:#f9fafb; border:1px dashed var(--ssc-border); border-radius:10px; padding:12px; margin-top:12px; font-size:18px}
.ssc-result__label{font-weight:800}
.ssc-result__value{font-weight:900; font-size:22px}
@media (max-width:640px){
  .ssc-header h1{font-size:22px}
}