```css
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    height: 100%;
}

body {
    background: #0a0a0f;
    color: #e0e0e0;
    font-family: system-ui, sans-serif;
    display: flex;
    flex-direction: column;
    height: 100vh;
}

hdr {
    background: linear-gradient(135deg, #1a1a2e, #16213e);
    border-bottom: 2px solid #e94560;
    padding: 12px 15px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

hdr h1 {
    color: #e94560;
    font-size: 1.5em;
    margin-right: auto;
}

hdr a {
    color: #60a5fa;
    font-size: .75em;
    text-decoration: none;
    cursor: pointer;
}

hdr a:hover {
    color: #e94560;
}

main {
    flex: 1;
    overflow-y: auto;
    padding: 6px;
}

vg {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ec {
    background: #111827;
    border: 1px solid #1e2d50;
    border-radius: 8px;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
}

.ec:hover {
    background: #1a1a2e;
    border-color: #e94560;
}

.ec .en {
    color: #e94560;
    font-weight: 700;
    font-size: .85em;
    white-space: nowrap;
}

.ec .ev {
    color: #8899aa;
    font-size: .72em;
    flex: 1;
}

.ec .em {
    color: #60a5fa;
    font-size: .68em;
    white-space: nowrap;
}

.sep {
    height: 1px;
    background: linear-gradient(90deg, transparent, #1e2d50, transparent);
    margin: 6px 0;
}

.blau-btn{border:1px solid #2563eb}.blau-btn .en{color:#60a5fa}.blau-btn:hover{border-color:#3b82f6}
.gruen-btn{border:1px solid #16a34a}.gruen-btn .en{color:#22c55e}.gruen-btn:hover{border-color:#22c55e}
.kbtn{background:none;border:1px solid #334155;color:#8899aa;border-radius:4px;padding:4px 10px;font-size:.72em;cursor:pointer}.kbtn:hover{background:#1e2d50;color:#e0e0e0}

/* --- build_teile_db enhancements --- */
.pt{cursor:pointer;border-bottom:1px solid #2a2a3a;padding:4px 6px}
.pt:hover{background:#1e1e30}
.pt .d{display:block;font-size:.75em;color:#e0e0e0}
.pt .n{font-family:monospace;font-size:.7em;color:#e94560}
.pt .x{display:block;font-size:.62em;color:#60a5fa;margin-top:1px}
.pt .alt{display:block;font-size:.6em;color:#22c55e;margin-top:1px}
.demontage{background:#1a1a2e;border:1px solid #e94560;border-radius:6px;padding:6px 8px;margin:6px;font-size:.68em}
.demontage .step{color:#94a3b8}
.demontage .step.highlight{color:#e94560;font-weight:bold}
.anleitung-link{display:inline-block;background:#1a3a5c;color:#60a5fa;padding:3px 8px;border-radius:4px;font-size:.7em;margin:4px 6px;text-decoration:none}
.anleitung-link:hover{background:#2a4a6c}
.treffer{background:#0a0a0f;border:1px solid #e94560;border-radius:6px;padding:8px;font-size:.75em}
.treffer b{color:#e94560}
.hit{cursor:pointer;color:#60a5fa;display:inline-block;margin:2px;padding:2px 5px;border:1px solid #333;border-radius:3px;font-family:monospace;font-size:.7em}
.hit:hover{background:#1e1e30}

.hg-nav{margin:4px 0 2px;display:flex;flex-wrap:wrap;gap:2px}
.hg-btn{background:#1e1e30;border:1px solid #2a2a3a;border-radius:4px;padding:2px 6px;
        font-size:.62em;cursor:default;color:#94a3b8;text-decoration:none;white-space:nowrap}
.hg-btn:hover{background:#2a2a4a;color:#e0e0e0}
.breadcrumb{font-size:.62em;color:#64748b;padding:2px 4px;margin:0}
.breadcrumb a{color:#60a5fa;text-decoration:none}
.breadcrumb a:hover{text-decoration:underline}
.breadcrumb .sep{color:#334155;margin:0 2px}

.meta-bar{display:flex;flex-wrap:wrap;gap:4px;margin:4px 6px}
.meta-item{background:#1e1e30;border-radius:4px;padding:3px 7px;font-size:.65em;white-space:nowrap}
.meta-item .label{color:#64748b}
.meta-item .value{color:#e0e0e0;font-weight:600}
.meta-item.diff{background:#1a1a2e;border-left:3px solid}
.meta-item.diff-5{border-color:#ef4444}
.meta-item.diff-4{border-color:#f97316}
.meta-item.diff-3{border-color:#eab308}
.meta-item.diff-2{border-color:#22c55e}
.meta-item.diff-1{border-color:#22c55e}
.tools-section{margin:6px 4px;background:#0a0a1a;border-radius:6px;padding:5px 7px}
.tools-title{font-size:.65em;color:#e94560;margin-bottom:3px;text-transform:uppercase}
.tools-list{display:flex;flex-wrap:wrap;gap:2px}
.tools-list span{background:#1e1e30;border-radius:3px;padding:2px 5px;font-size:.6em;color:#94a3b8}
.special-tools-list span{background:#2a1a1a;color:#f97316}
.beginner-box{margin:6px 4px;padding:5px 7px;border-radius:6px;font-size:.7em;font-weight:600}
.beginner-ok{background:#0a2a0a;border:1px solid #22c55e;color:#22c55e}
.beginner-warn{background:#2a1a00;border:1px solid #eab308;color:#eab308}
.beginner-no{background:#2a0a0a;border:1px solid #ef4444;color:#ef4444}