:root { --bg:#0b0c10; --card:#12141b; --text:#e7e7ea; --muted:#9aa0aa; --line:#222633; }
*{ box-sizing:border-box; }
body{ margin:0; font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial; background:var(--bg); color:var(--text); }
.container{ max-width:980px; margin:0 auto; padding:24px; }
.header{ margin-bottom:18px; }
.muted{ color:var(--muted); }

.card{ background:var(--card); border:1px solid var(--line); border-radius:16px; padding:16px; }
.notice{ margin:12px 0; padding:12px; border-radius:12px; background:#122016; border:1px solid #234f2c; }

button{ background:#2b6cff; border:0; color:white; padding:10px 14px; border-radius:12px; cursor:pointer; }
input[type="file"]{ display:block; margin:12px 0; color:var(--muted); }

.timeline{ display:flex; flex-direction:column; gap:14px; }
.day{ background:var(--card); border:1px solid var(--line); border-radius:18px; padding:14px; }
.day-header{ display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.date{ font-weight:700; letter-spacing:0.2px; }

.photos{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.photo-card{ border:1px solid var(--line); border-radius:14px; overflow:hidden; background:#0f1117; }
.label{ padding:10px 12px; color:var(--muted); border-bottom:1px solid var(--line); }
img{ width:100%; height:320px; object-fit:cover; display:block; }
@media (max-width:720px){ .photos{ grid-template-columns:1fr; } img{ height:260px; } }

.sentinel{ text-align:center; padding:18px; color:var(--muted); }
a{ color:#8fb0ff; }

/* --- Tree background layer --- */
#tree-bg{
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

#tree-svg{
    position: absolute;
    right: -40px;
    bottom: -40px;
    height: 110vh;
    width: auto;
    opacity: 0.35;
    filter: blur(0px);
}

/* Stelle sicher, dass dein Content über dem Hintergrund liegt */
.container{ position: relative; z-index: 1; }

/* Baum-Stil */
.tree-branch{
    fill: none;
    stroke: rgba(160, 120, 80, 0.85);
    stroke-width: 14;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.leaf{
    fill: rgba(120, 185, 120, 0.85);
}

