html, body {
            margin: 0;
            padding: 0;
            background: url('../background.png') no-repeat center center fixed;
            background-size: cover;
            font-family: Arial, sans-serif;
            color: #fff;
            box-sizing: border-box;
        }
        body {
            overflow: hidden; 
            
        }

        h1 {
            color:rgb(95, 210, 255);
            margin: 10px 0 0 20px;
            font-size: 1.8em;
        }

        strong {
            align-items: center;
            text-align: center;
            color: #e0a0ff;
        }

        .logout-btn {
            margin: 1em 1em 0 0;
            float: right;
            background: #9600c8ff;
            color: white;
            border: none;
            font-size: 0.85em;
            padding: 0.75em;
            border-radius: 1em;
        }

        .container {
            position: absolute;
            top: 50px;
            left: 10px;
            right: 10px;
            bottom: 10px;
            display: flex;
            height: calc(100% - 60px);
            border: none;
            box-sizing: border-box;
        }

        /* Lewa kolumna */
        .main-left {
            width: 50%;
            display: flex;
            flex-direction: column;
        }

        .area-half {
            flex: 1;
            display: flex;
            flex-direction: column;
            padding: 10px;
            overflow: hidden;
            box-sizing: border-box;
        }

        .area-half > div:first-child {
            margin-bottom: 6px;
        }

        .image-drop-zone {
            flex: 1;
            background: #101010;
            border: 3px dashed rgb(0, 255, 155);
            border-radius: 0.5em;
            color: #80d8fe;
            text-align: center;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: auto;
            padding: 10px;
        }
        .image-drop-zone img {
            max-width: 100%;
            max-height: 90%;
        }

        #prompt {
            flex: 1;
            width: 100%;
            resize: none;
            padding: 8px 10px;
            background: #101010;
            color: #ffffffff;
            border: 3px solid rgb(0, 255, 155);
            border-radius: 0.5em;
            overflow-y: auto;
            box-sizing: border-box;
        }

        /* Prawa kolumna */
        .output-area {
            width: 50%;
            display: flex;
            flex-direction: column;
            padding: 10px;
            box-sizing: border-box;
        }

        .output-label {
            font-weight: bold;
            margin-bottom: 5px;
            font-size: 16px;
        }

        #output {
            flex: 1;
            font-size: 14px;
            color: #77d6ffff;
            background: #101010;
            border: 3px solid rgb(0, 255, 155);
            border-radius: 0.5em;
            padding: 8px 10px;
            box-sizing: border-box;
            resize: none;
            overflow-y: auto;
            margin-bottom: 8px;
        }

        .output-controls {
            display: flex;
            gap: 1em;
        }
        button, .main-btn {
            font-size: 15px;
            padding: 7px 16px;
            border-radius: 7px;
            border: none;
            cursor: pointer;
            font-weight: bold;
        }

        #btn-copy { background: #0274ea; color:#fff;}
        #btn-clear { background: #c60a2e; color:#fff;}
        #btn-send { background: #00ff00; color:#191e23;}
        #btn-paste-img { background: #ffe200; color:#23292d;}
