body{font-family:Inter,Arial,sans-serif;background:#f4f7fb;color:#1f2937;margin:0}
header{background:#0f172a;color:#fff;padding:16px 24px;position:sticky;top:0;z-index:10}
header .brand{font-size:20px;font-weight:700}
nav{margin-top:10px;display:flex;gap:14px;flex-wrap:wrap}
nav a{color:#dbeafe;text-decoration:none;font-weight:600}
nav a:hover{color:#fff}
main{max-width:1240px;margin:24px auto;padding:0 16px 40px}
.panel,.card{background:#fff;border:1px solid #dbe3ee;border-radius:14px;box-shadow:0 6px 20px rgba(15,23,42,.04)}
.panel{padding:20px;margin-bottom:20px}
.card{padding:18px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.stats .value{font-size:28px;font-weight:700;color:#0f172a}
.stats .label{color:#64748b;font-size:14px}
table{width:100%;border-collapse:collapse}
th,td{padding:10px 12px;border-bottom:1px solid #e5e7eb;text-align:left;vertical-align:top}
th{background:#f8fafc;font-size:14px}
input,select,textarea{width:100%;padding:10px;border:1px solid #cbd5e1;border-radius:10px;box-sizing:border-box;background:#fff}
label{display:block;font-weight:600;margin-bottom:6px}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
button,.btn{display:inline-block;background:#2563eb;color:#fff;border:none;padding:10px 16px;border-radius:10px;cursor:pointer;text-decoration:none;font-weight:600}
.btn.secondary,button.secondary{background:#475569}
.btn.light,button.light{background:#e2e8f0;color:#0f172a}
.btn.danger,button.danger{background:#dc2626;color:#fff}
.btn.danger-outline,button.danger-outline{background:#fff;color:#b91c1c;border:1px solid #fca5a5}
.flash{padding:12px 14px;border-radius:10px;margin-bottom:12px}
.flash.success{background:#dcfce7;color:#166534}
.flash.error{background:#fee2e2;color:#991b1b}
.flash.info{background:#dbeafe;color:#1d4ed8}
.badge{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700}
.badge.draft{background:#fef3c7;color:#92400e}
.badge.submitted{background:#dcfce7;color:#166534}
.badge.archived{background:#e5e7eb;color:#334155}
.badge.active{background:#dcfce7;color:#166534}
.badge.inactive{background:#fee2e2;color:#991b1b}
.metric{font-size:12px;color:#64748b}
.legend{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.legend span{background:#eff6ff;border:1px solid #bfdbfe;color:#1d4ed8;padding:6px 10px;border-radius:999px;font-size:12px}
.subtheme-card{border:1px solid #e2e8f0;border-radius:12px;padding:14px;background:#fbfdff;margin-bottom:12px}
.subtheme-meta{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:start}
.subtheme-desc{color:#475569;font-size:14px;margin-top:6px}
.comment-box{display:none;margin-top:10px}
.comment-box.visible{display:block}
.block-header{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:10px;flex-wrap:wrap}
.score-box{background:#eff6ff;border:1px solid #bfdbfe;border-radius:12px;padding:10px 12px;color:#1d4ed8;font-weight:700}
footer{margin-top:24px;color:#64748b;font-size:13px}
.kpi{display:flex;justify-content:space-between;gap:10px;align-items:center}
.small{font-size:12px;color:#64748b}
hr{border:none;border-top:1px solid #e5e7eb;margin:20px 0}
code.inline{background:#f8fafc;padding:2px 6px;border-radius:6px}
.danger-panel{border-color:#fecaca;background:#fff7f7}
.choice-card{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid #dbe3ee;border-radius:12px;background:#fff;cursor:pointer}
.choice-card input{width:auto;margin-top:3px}
.danger-choice{border-color:#fecaca;background:#fff5f5}
.value-small{font-size:18px;font-weight:700;color:#0f172a}
.wide-field{grid-column:1/-1}
.identity-box{background:#f8fafc;border:1px solid #dbe3ee;border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:6px}
.block-filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.block-pill{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;border:2px solid #cbd5e1;background:#f8fafc;cursor:pointer;transition:transform .15s ease, box-shadow .15s ease}
.block-pill:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(15,23,42,.08)}
.block-pill input{width:auto;margin:0;accent-color:currentColor}
.block-pill span{font-weight:700;font-size:14px}
.block-panel{border-width:2px}
.block-accent{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700;margin-bottom:8px}
.block-tone-0{border-color:#93c5fd;background:#eff6ff;color:#1d4ed8}
.block-tone-1{border-color:#86efac;background:#ecfdf5;color:#15803d}
.block-tone-2{border-color:#f9a8d4;background:#fdf2f8;color:#be185d}
.block-tone-3{border-color:#fdba74;background:#fff7ed;color:#c2410c}
.block-tone-4{border-color:#c4b5fd;background:#f5f3ff;color:#6d28d9}
.block-tone-5{border-color:#fcd34d;background:#fffbeb;color:#b45309}
.block-panel.block-tone-0,.block-panel.block-tone-1,.block-panel.block-tone-2,.block-panel.block-tone-3,.block-panel.block-tone-4,.block-panel.block-tone-5{background-image:linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.96))}
.block-panel .block-accent.block-tone-0{background:#dbeafe;color:#1d4ed8}
.block-panel .block-accent.block-tone-1{background:#dcfce7;color:#15803d}
.block-panel .block-accent.block-tone-2{background:#fce7f3;color:#be185d}
.block-panel .block-accent.block-tone-3{background:#ffedd5;color:#c2410c}
.block-panel .block-accent.block-tone-4{background:#ede9fe;color:#6d28d9}
.block-panel .block-accent.block-tone-5{background:#fef3c7;color:#b45309}
.block-panel.block-tone-0{box-shadow:0 8px 20px rgba(59,130,246,.08)}
.block-panel.block-tone-1{box-shadow:0 8px 20px rgba(34,197,94,.08)}
.block-panel.block-tone-2{box-shadow:0 8px 20px rgba(236,72,153,.08)}
.block-panel.block-tone-3{box-shadow:0 8px 20px rgba(249,115,22,.08)}
.block-panel.block-tone-4{box-shadow:0 8px 20px rgba(139,92,246,.08)}
.block-panel.block-tone-5{box-shadow:0 8px 20px rgba(245,158,11,.08)}
.rating-scale-panel{margin-top:14px;padding:14px;border:1px solid #dbe3ee;border-radius:12px;background:#f8fafc}
.rating-scale-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-top:10px}
.rating-scale-card{border:1px solid #dbe3ee;border-radius:12px;background:#fff;padding:10px 12px}
.rating-scale-title{font-weight:700;color:#0f172a;margin-bottom:4px}
.rating-column{min-width:320px}
.rating-widget{display:flex;flex-direction:column;gap:8px}
.stars-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.star-button{background:#e5e7eb;color:#94a3b8;border:none;border-radius:10px;padding:8px 10px;font-size:22px;line-height:1;min-width:44px}
.star-button.active{background:#fef3c7;color:#d97706}
.star-button:hover{background:#fde68a;color:#b45309}
.reset-rating{background:#eef2f7;color:#334155;border:none;border-radius:10px;padding:8px 12px;font-weight:600}
.reset-rating.active{background:#dbeafe;color:#1d4ed8}
.rating-current-info{font-size:12px;color:#475569;background:#f8fafc;border:1px dashed #cbd5e1;border-radius:10px;padding:8px 10px}
@media (max-width: 900px){
  .wide-field{grid-column:auto}
  .kpi,.block-header,.subtheme-meta{grid-template-columns:1fr}
  .rating-column{min-width:auto}
}
