html {
    overflow-y: scroll;
    scrollbar-gutter: stable;
}
body {
    caret-color: transparent;
}
input,
textarea,
[contenteditable="true"] {
   caret-color: auto;
}

/* =========================
   MOBILE NAV – DESKTOP AUS
========================= */
.mobile-nav-toggle,
.mobile-nav{
    display:none;
}

/* =========================
   NAVBAR – DESKTOP (GLOBAL)
========================= */
.navbar{
    width:100%;
    padding:14px 0;
    background:#111;
    border-bottom:2px solid rgba(0,200,200,.4);
    text-align:center;
    position: sticky;   /* 🔥 bleibt oben */
    top: 0;
    z-index: 9999;
}

.navbar a{
    color:#eaffff;
    text-decoration:none;
    margin:0 15px;
    font-size:16px;
    opacity:.85;
}
.navbar a:hover{
    opacity:1;
    text-shadow:0 0 8px rgba(0,200,200,.6);
}

/* =========================
   MOBILE NAVBAR (NUR MOBILE)
========================= */
@media (max-width:768px){

    /* Desktop-Navigation ausblenden */
    .navbar{
        display:none;
    }

    /* Wrapper für ☰ + Menü */
    .mobile-nav-toggle{
        position:fixed;
        top:12px;
        left:12px;
        display:flex;
        align-items:center;
        gap:10px;
        z-index:10001;
        cursor:pointer;
        user-select:none;
    }

    /* Hamburger Striche */
    .mobile-nav-toggle .burger{
        display:flex;
        flex-direction:column;
        gap:5px;
    }

    .mobile-nav-toggle .burger span{
        width:26px;
        height:3px;
        background:#00c8c8;
        border-radius:3px;
        box-shadow:0 0 6px rgba(0,200,200,.6);
    }

    /* Menü-Text */
    .mobile-nav-toggle .label{
        font-size:15px;
        color:#eaffff;
        opacity:.9;
        letter-spacing:.4px;
        text-shadow:0 0 6px rgba(0,200,200,.4);
    }

    /* Mobile Menü */
    .mobile-nav{
        position:fixed;
        top:0;
        left:0;
        width:100%;
        background:#111;
        z-index:10000;
        display:none;
        flex-direction:column;
        padding-top:60px;
        border-bottom:2px solid rgba(0,200,200,.4);
    }

    .mobile-nav a{
        padding:14px 0;
        text-align:center;
        border-top:1px solid rgba(255,255,255,.06);
        color:#eaffff;
        text-decoration:none;
        font-size:16px;
    }

    .mobile-nav a:hover{
        background:rgba(0,200,200,.08);
    }

    .mobile-nav.open{
        display:flex;
    }
}


/* ??? Erinnerungstext */
.memory-text{
    margin-top:28px;
    font-size:16px;
    line-height:1.7;
    color:#dffefe;
    opacity:0.9;

    text-align:center;
    max-width:420px;
    margin-left:auto;
    margin-right:auto;

    text-shadow:0 0 6px rgba(0,200,200,.25);
}

/* ===== LAYOUT BASIS ===== */

body{
    background:#0e0e0e;
    font-family: Arial, sans-serif;
    color:white;
    margin:0;
    min-height:100vh;
}

/* ===== RECHTER CONTENT ===== */

.right{
    flex:1;
    display:block;
    text-align:center;
}