:root, [data-selected-theme="ri"] {
            --color-background-primary: #FFAAAA;
            --color-background-button: #DD9999;
            --color-background-second: #884444;
            
            --color-text-primary: #FFCCAA;
            --color-text-button: #CCFFAA;
            --color-text-second: #FFAAAA;
            
            --color-background-rt:#330000;
            --color-text-rt:#FFAAAA;
            
            --color-border:#882222;
            
            --color-accent: #AA8888;
        }

        body {
            font-family: sans-serif;
            background-color:#000000;
            margin:3px;
            color: var(--color-text-primary);
            display:flex;
            flex-direction: column;
        }
        
        .h {
            visibility: collapse;
        }

        a, summary, button {
            color: var(--color-text-button);
            background-color:rgba(0,0,0,0);
            border-style:solid;
            border-width:2px;
            border-color:var(--color-border);
            border-radius:3px; 
            text-decoration:none;
            min-height:3vh;
            padding:5px;
            padding-top:0px; 
            padding-bottom:0px;
            margin-top:10px;
            margin-bottom:10px;
            
            white-space: nowrap;
            overflow-wrap: normal;
        }
        
        a:hover, summary:hover, button:hover {
            background-color: var(--color-background-second);
            color: var(--color-text-second);
        }
        
        h1, h2, h3, h4, h5, h6 {
            padding-top:0px;
            padding-bottom:0px;
            
            
            background-color:rgba(255,255,255,0.1);
            border:5px solid hidden;
            border-radius:5px;
            margin:0px;
            
            font-weight:bold;
        }
        
        h1 {
            font-size:2.0em;
            padding-left:0.5%;
        }
        h2 {
            font-size:1.9em;
            padding-left:2%;
            
        }
        h3 {
            font-size:1.8em;
            padding-left:4%;
            
        }
        h4 {
            font-size:1.7em;
            padding-left:6%;
            
        }
        h5 {
            font-size:1.6em;
            padding-left:6.5%;
            
        }
        h6 {
            font-size:1.5em;
            padding-left:7%;
            
        }

        
        block {
            background: rgba(255, 255, 255, 0.14);
            border-radius: 16px;
            box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
            backdrop-filter: blur(4.8px);
            -webkit-backdrop-filter: blur(4.8px);
            border: 1px solid rgba(255, 255, 255, 0.33);

            text-decoration:none;
            font-family: Verdana, Geneva, Tahoma, sans-serif;
            display: block;
            text-align: center;
            width: auto;
        }

        nav {
            background: rgba(255, 255, 255, 0.14);
            border-radius: 16px;
            box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
            backdrop-filter: blur(4.8px);
            -webkit-backdrop-filter: blur(4.8px);
            border: 1px solid rgba(255, 255, 255, 0.33);
            
            z-index:50;
            
            padding:5px;
        }

        nav ul {
            background-color: var(--color-background-primary);
            list-style: none;
            margin: 0;
            padding: 0;
            display: flex;
            justify-content: space-around;
            flex-wrap: wrap;
            
            border:5px solid;
            border-radius:20px;
            
            background: rgba(255, 255, 255, 0.14);
            border-radius: 16px;
            box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
            backdrop-filter: blur(4.8px);
            -webkit-backdrop-filter: blur(4.8px);
            border: 1px solid rgba(255, 255, 255, 0.33);
            
        }

        nav li {
            position: relative;
            width:auto;
        }

        nav a {
            color: var(--color-text-button);
            background-color:var(--color-background-button);
            text-decoration: none;
            padding: 5px 10px;
            display: block;
            width:auto;
            
            background: rgba(255, 255, 255, 0.14);
            border-radius: 16px;
            box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
            backdrop-filter: blur(4.8px);
            -webkit-backdrop-filter: blur(4.8px);
            border: 1px solid rgba(255, 255, 255, 0.33);
        }

        nav a:hover {
            background-color: var(--color-background-second);
            color: var(--color-text-second);
        }

        nav ul ul {
            display: none;
            position: absolute;
            top: 100%;
            left: 0;
            background-color: rgba(10,10,10,0.1);
            box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
            z-index: 1;
            flex-direction: column;
        }

        nav ul ul li {
            width: 100%;
        }

        nav ul ul a {
            padding: 10px;
        }

        nav ul ul a:hover {
            background-color: #ddd;
        }

        .has-submenu > a::after {
            content: " \21F2";
            margin-left: 5px;
        }

        .has-submenu.open > a::after {
            transform: rotate(90deg);
            transition: transform 0.2s ease;
        }

        .has-submenu.open > ul {
            display: flex;
        }
        
        .motd {
            background-color:var(--color-background-rt);
            
            margin:5px;
            border:5px solid;
            border-radius:20px;
            border-color:rgba(0,0,0,1);
        }
        
        .content {
            display: flex; 
            flex-direction: column; 
            justify-content: space-evenly;
            min-height:90vh;
            width:90vw;
            max-width:800px;
            margin:10px;
            margin-left: auto;
            margin-right:auto;
            padding:10px;
            
            background: rgba(255, 255, 255, 0.14);
            border-radius: 16px;
            box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
            backdrop-filter: blur(4.8px);
            -webkit-backdrop-filter: blur(4.8px);
            border: 1px solid rgba(255, 255, 255, 0.33);
            
            white-space: normal;
            word-wrap: break-word;
            overflow-wrap: anywhere;
        }
        
        footer {
            text-align: center;
            left: 0;
            bottom: 0; 
            display: flex; 
            flex-direction: column; 
            justify-content: flex-end; 
            font-family: monospace;
            
            background: rgba(255, 255, 255, 0.14);
            border-radius: 16px;
            box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
            backdrop-filter: blur(4.8px);
            -webkit-backdrop-filter: blur(4.8px);
            border: 1px solid rgba(255, 255, 255, 0.33);
        }
        
        @media (max-width: 800px) {
            nav ul {
                flex-direction: column;
                align-items: center;
            }
            
            nav li {
                width: 100%;
                text-align: center;
            }

            nav ul ul {
                position: relative;
                top: 0;
                left: 0;
            }
            body {
                font-size: 1.2em;
            }
        }
        
        @media (min-width: 800px) {
            nav {
                position: sticky;
                top: 0;
                left: 0;
            }
        }
        
        .rt-text {
            color:var(--color-text-rt); 
            font-family: monospace;
            display: flex; 
            flex-direction: column; 
            justify-content: flex-end;
        }
        
        
        @media (min-width: 800px) {
            .rt-text {
                font-size:5px;
            }
            .banner-img {
                max-width:40vw;
            }
        }
        
        @media (max-width: 800px) {
            .rt-text {
                font-size:3px;
            }
            .banner-img {
                max-width:60vw;
            }
        }
        
        @media (max-width: 500px) {
            .rt-text {
                font-size:1.8px;
            }
            .banner-img {
                max-width:60vw;
            }
        }
        
        @media (max-width: 300px) {
            .rt-text {
                font-size:1px;
            }
            .banner-img {
                max-width:70vw;
            }
        }
        .theme-switcher {
            color:inherit;
            background-color: inherit;
            margin:5px;
            padding:10px;
            border: 2px;
            border-color: var(--color-border);
            border-radius:5px;
            text-align: center;
        }
        
        input, textarea {
            color:var(--color-text-second);
            background-color: var(--color-background-second);
            border: 2px;
            border-color:var(--color-border);
            border-radius:2px;
        }
        
        ul {
            padding-left:1px;
        }
        
        table.hit {
            border: none;
            background: transparent;
            margin: 2em auto;
            font-family: sans-serif;
            font-size: 0.9em;
            color: var(--color-text-second);
            text-align: center;
        }
        
        table.hit th,
        table.hit td {
            border: none;
            padding: 2px 8px;
        }
        
        
        table.hit th {
            font-weight: normal;
            color: var(--color-text-second);
        }
        @media (max-width: 600px) {
            table.hit {
                font-size: 0.8em;
            }
        }
        
        
        table th {
            border: 4px solid;
        }
        
        table td {
            border: 2px solid;
        }
        
        table td, table th {
            border-radius: 5px;
            padding:8px;
            text-align:center;
            margin:4px;
        }
        

        li {
            margin-top:7px;
            margin-bottom:7px;
            list-style-type: none;
        }
        
        
        #lightbox {
          display: none;
          position: fixed;
          inset: 0;
          background: rgba(0,0,0,0.8);
          justify-content: center;
          align-items: center;
          z-index: 1000;
        }
        #lightbox img {
          max-width: 90%;
          max-height: 90%;
          box-shadow: 0 0 20px #000;
          border: 4px solid #fff;
          border-radius: 8px;
        }
        #lightbox span {
          position: absolute;
          top: 20px;
          right: 30px;
          font-size: 30px;
          font-weight: bold;
          color: #fff;
          cursor: pointer;
        }
        
        .fileview {
            border:none;
            border-left:5px solid;
            border-bottom:2px solid;
            border-radius:10px;
            border-color: var(--color-background-second);
            padding-left:5px;
        }
        dialog::backdrop {
            background: rgba(100,50,50,0.5); /* blockiert den Hintergrund visuell */
        }