diff --git a/frontend/index.html b/frontend/index.html
index 16967d3..b894f5f 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -4,7 +4,9 @@
D4RKST3R // DEVLOG
-
+
+
+
diff --git a/frontend/public/favicon.svg b/frontend/public/favicon.svg
new file mode 100644
index 0000000..1c4f071
--- /dev/null
+++ b/frontend/public/favicon.svg
@@ -0,0 +1,6 @@
+
diff --git a/frontend/src/style.css b/frontend/src/style.css
index 2844bdb..e089c06 100644
--- a/frontend/src/style.css
+++ b/frontend/src/style.css
@@ -35,6 +35,25 @@ body {
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }
+/* Text-Auswahl & Fokus im Brand-Look */
+::selection { background: rgba(245, 197, 24, .25); color: var(--text); }
+:focus-visible { outline: 1px solid var(--neon); outline-offset: 2px; }
+
+/* Dunkle Scrollbar */
+::-webkit-scrollbar { width: 10px; height: 10px; }
+::-webkit-scrollbar-track { background: var(--bg); }
+::-webkit-scrollbar-thumb { background: #262626; border: 2px solid var(--bg); border-radius: 6px; }
+::-webkit-scrollbar-thumb:hover { background: var(--neon); }
+
+/* Einblend-Animation für Inhalte */
+@keyframes riseIn {
+ from { opacity: 0; transform: translateY(10px); }
+ to { opacity: 1; transform: none; }
+}
+@media (prefers-reduced-motion: reduce) {
+ *, *::before, *::after { animation: none !important; transition: none !important; }
+}
+
/* ── NOISE + SCANLINES ─────────────────────────────── */
body::before {
content: ''; position: fixed; inset: 0;
@@ -83,7 +102,9 @@ body::after {
font-family: var(--display);
font-size: 1.6rem; letter-spacing: .15em; color: var(--neon);
line-height: 1;
+ transition: text-shadow .25s;
}
+.nav-logo:hover { text-shadow: 0 0 18px rgba(245, 197, 24, .55); }
.nav-logo span { color: var(--neon2); }
.nav-links { display: flex; gap: 1.75rem; flex: 1; }
@@ -151,6 +172,7 @@ body::after {
position: relative; z-index: 2;
max-width: 860px; width: 100%;
margin: 0 auto;
+ animation: riseIn .45s ease both;
}
.page-tag {
font-family: var(--mono);
@@ -176,6 +198,7 @@ body::after {
max-width: 860px; width: 100%;
margin: 0 auto;
padding: 2.75rem 2.5rem 5rem;
+ animation: riseIn .45s ease .08s both;
}
.notice { color: var(--muted); padding: 1.5rem 0; font-size: 1.05rem; }
@@ -245,6 +268,11 @@ body::after {
width: 7px; height: 7px;
background: var(--neon);
box-shadow: 0 0 10px rgba(245, 197, 24, .6);
+ transition: box-shadow .25s, transform .25s;
+}
+.timeline .card:hover::before {
+ box-shadow: 0 0 16px rgba(245, 197, 24, .9);
+ transform: scale(1.25);
}
.card-meta {
@@ -564,7 +592,11 @@ a.sha:hover { border-color: var(--neon); background: rgba(245, 197, 24, .07); }
padding: .5rem 1.1rem;
transition: background .2s, border-color .2s, opacity .2s;
}
-.btn:hover:not(:disabled) { border-color: var(--neon); background: rgba(245, 197, 24, .08); }
+.btn:hover:not(:disabled) {
+ border-color: var(--neon);
+ background: rgba(245, 197, 24, .08);
+ box-shadow: 0 0 14px rgba(245, 197, 24, .18);
+}
.btn:disabled { opacity: .25; cursor: default; }
/* ── FOOTER ────────────────────────────────────────── */