:root { --ink: #14324a; --blue: #1269a8; --teal: #0d8a82; --mist: #f3f8fb; }
body { background: var(--mist); color: var(--ink); }
.hero { color: white; background: radial-gradient(circle at 80% 20%, #18a9a1, transparent 38%), linear-gradient(125deg, #073a64, #1269a8); }
.form-shell { background: #fff; border-radius: 1rem; box-shadow: 0 12px 36px rgba(18, 65, 99, .12); overflow: hidden; }
.form-section { border-left: 4px solid var(--teal); }
.section-title { color: #0a5c90; font-weight: 700; }
.table-responsive { border: 1px solid #dce8ef; border-radius: .6rem; }
table { min-width: 740px; }
th { background: #e8f4f7 !important; color: #164561 !important; font-size: .82rem; }
td:first-child { font-weight: 600; min-width: 180px; }
.autosave { position: sticky; bottom: 1rem; z-index: 5; box-shadow: 0 4px 18px rgba(0,0,0,.14); }
.question { white-space: pre-line; }
textarea.form-control { min-height: 105px; }
.type-card { cursor: pointer; transition: transform .15s, box-shadow .15s; height: 100%; }
.type-card:hover, .type-card:focus-within { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(18,105,168,.17); }