:root {
  --cp: #3f3f46;
  --ca: #ec4899;
  --cbg: #fafafa;
}
body { background: var(--cbg); color: #1f2937; font-family: system-ui, sans-serif; margin: 0; }
.site-header { background: var(--cp); padding: 0; }
.utility-bar { background: color-mix(in srgb, var(--cp) 80%, black); padding: 6px 0; font-size: 13px; color: #e5e7eb; }
.utility-bar a { color: var(--ca) !important; text-decoration: none; }
.brand-name { color: #fff; font-weight: 700; font-size: 1.35rem; }
.uk-navbar-nav > li > a { color: #fff !important; font-weight: 500; }
.uk-navbar-nav > li > a:hover, .uk-navbar-nav > li > a.uk-active { color: var(--ca) !important; }
.hero-section { background: linear-gradient(135deg, var(--cp) 0%, color-mix(in srgb, var(--cp) 70%, #000) 100%); color: #fff; padding: 60px 0; }
.section-title { color: var(--cp); border-left: 4px solid var(--ca); padding-left: 12px; margin-bottom: 16px; }
.accent { color: var(--ca); }
.card-highlight { border-top: 4px solid var(--ca); }
table.maut-table { width: 100%; border-collapse: collapse; }
table.maut-table th { background: var(--cp); color: #fff; padding: 10px 14px; text-align: left; }
table.maut-table td { padding: 9px 14px; border-bottom: 1px solid #e5e7eb; }
table.maut-table tr:nth-child(even) td { background: color-mix(in srgb, var(--cbg) 80%, var(--cp) 20%); }
.timeline-item { border-left: 3px solid var(--ca); padding-left: 18px; margin-bottom: 24px; position: relative; }
.timeline-item::before { content: ""; width: 12px; height: 12px; background: var(--ca); border-radius: 50%; position: absolute; left: -7px; top: 4px; }
.related-links { background: color-mix(in srgb, var(--cbg) 60%, #e5e7eb); border-radius: 8px; padding: 16px; margin-top: 24px; }
footer { background: var(--cp); color: #d1d5db; padding: 40px 0 20px; }
footer a { color: var(--ca) !important; }
.cookie-banner { display: none; position: fixed; bottom: 0; left: 0; right: 0; background: var(--cp); color: #fff; padding: 16px 24px; z-index: 9999; align-items: center; gap: 16px; flex-wrap: wrap; }
.checklist li { list-style: none; padding-left: 28px; position: relative; margin-bottom: 8px; }
.checklist li::before { content: "✓"; color: var(--ca); position: absolute; left: 0; font-weight: bold; }
details summary { cursor: pointer; font-weight: 600; color: var(--cp); padding: 10px 0; border-bottom: 1px solid #e5e7eb; }
details[open] summary { color: var(--ca); }
details p { padding: 10px 0; }
.back-to-hub { display: inline-block; margin-top: 16px; color: var(--ca) !important; font-weight: 600; text-decoration: none; }
.uk-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.uk-grid { display: flex; flex-wrap: wrap; gap: 24px; }
.uk-width-1-2\@m { width: calc(50% - 12px); }
.uk-width-1-3\@m { width: calc(33.333% - 16px); }
.uk-width-2-3\@m { width: calc(66.666% - 8px); }
.uk-width-1-4\@m { width: calc(25% - 18px); }
.uk-width-2-3\@l { width: calc(66.666% - 8px); }
@media (max-width: 768px) {
  .uk-width-1-2\@m, .uk-width-1-3\@m, .uk-width-2-3\@m, .uk-width-1-4\@m, .uk-width-2-3\@l { width: 100%; }
}
.uk-card { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,0.08); }
.uk-card-body { padding: 24px; }
.uk-button { display: inline-block; padding: 10px 20px; border-radius: 6px; cursor: pointer; font-weight: 600; text-decoration: none; border: none; }
.uk-button-primary { background: var(--cp); color: #fff; }
.uk-button-warning { background: var(--ca); color: var(--cp); }
.uk-input, .uk-textarea, .uk-select { width: 100%; padding: 8px 12px; border: 1px solid #d1d5db; border-radius: 6px; font-size: 14px; margin-top: 4px; }
.uk-form-label { font-weight: 600; font-size: 14px; color: var(--cp); }
.uk-checkbox { margin-right: 8px; }
.uk-list { padding: 0; list-style: none; }
.uk-list li { margin-bottom: 6px; }
.uk-list-bullet li { padding-left: 20px; position: relative; }
.uk-list-bullet li::before { content: "•"; position: absolute; left: 0; color: var(--ca); }
.uk-overflow-auto { overflow-x: auto; }
nav { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; }
nav ul { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; }
nav ul li a { padding: 8px 12px; border-radius: 4px; text-decoration: none; font-size: 14px; }
nav ul li a:hover { background: rgba(255,255,255,0.15); }
.nav-logo { display: flex; align-items: center; gap: 8px; text-decoration: none; }