:root {
            /* Paleta z logo COMPAAN (CMYK + szarość) */
            --c-cyan:    #00A0E0;
            --c-magenta: #E6007E;
            --c-yellow:  #FFF200;
            --c-gray:    #A0A0A0;

            /* Akcent marki 7minut/COMPAAN */
            --accent: var(--c-cyan);
            --accent-alt: var(--c-magenta);
            --accent-soft: rgba(0,160,224,0.16);

            /* Panele i ramki */
            --panel: #111523;
            --panel-alt: #0d101b;
            --border: rgba(255,255,255,0.14);

            /* Dark theme – wartości domyślne */
            --bg: #0C0E12;
            --bg-soft: #151824;
            --bg-softer: #191C27;
            --text: #F6F7FB;
            --text-soft: #E3E4EB;
            --muted: #9DA1B2;
            --border-soft: rgba(255,255,255,0.08);
            --shadow-strong: 0 18px 40px rgba(0,0,0,0.7);
            --shadow-soft: 0 12px 30px rgba(0,0,0,0.55);
        }

        :root[data-theme="light"] {
            --bg: #F5F6FA;
            --bg-soft: #FFFFFF;
            --bg-softer: #EDF0F7;
            --text: #13141A;
            --text-soft: #2E3140;
            --muted: #6E7282;
            --panel: #FFFFFF;
            --panel-alt: #F6F7FB;
            --border: rgba(0,0,0,0.12);
            --border-soft: rgba(0,0,0,0.08);
            --shadow-strong: 0 16px 30px rgba(0,0,0,0.12);
            --shadow-soft: 0 10px 20px rgba(0,0,0,0.08);
        }

        * {
            box-sizing: border-box;
        }

        html {
            scrollbar-gutter: stable;
        }

        body {
            margin: 0;
            font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
            background:
                radial-gradient(circle at top left, rgba(0,160,224,0.22) 0, transparent 38%),
                radial-gradient(circle at top right, rgba(230,0,126,0.20) 0, transparent 42%),
                var(--bg);
            color: var(--text);
        }

        :root[data-theme="light"] body {
            background:
                radial-gradient(circle at top left, rgba(0,160,224,0.18) 0, transparent 40%),
                radial-gradient(circle at top right, rgba(255,242,0,0.18) 0, transparent 42%),
                var(--bg);
        }

        a {
            color: inherit;
            text-decoration: none;
        }

        a:hover {
            text-decoration: underline;
        }

        .page {
            min-height: 100vh;
            max-width: 1120px;
            margin: 0 auto;
            padding: 24px 16px 40px;
        }

        @media (min-width: 900px) {
            .page {
                padding: 32px 24px 56px;
            }
        }

        /* HEADER */

        header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }

        .brand-left {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }

        /* Ramki na logotypy 7minut i COMPAAN */
        .brand-logo {
            width: 96px;
            height: 68px;
            border-radius: 20px;
            padding: 6px 8px;
            background:
                radial-gradient(circle at top, rgba(255,242,0,0.18), transparent 60%),
                #eef1f8; /* jasne tło także w dark, żeby loga były czytelne */
            border: 1px solid var(--border-soft);
            box-shadow: var(--shadow-soft);
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }

        :root[data-theme="light"] .brand-logo {
            background:
                radial-gradient(circle at top, rgba(255,242,0,0.16), transparent 60%),
                #eef1f8; /* jasne, ale nie czyste białe */
        }

        /* Obrazki w ramkach – bazowo tylko blokowe */
        .brand-logo img {
            display: block;
        }

        /* Logo 7minut (po lewej) – 100% w ramce */
        .brand-left .brand-logo:first-child img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            object-position: center;
        }

        /* Logo COMPAAN (po prawej) – 150% w ramce, przycięte */
        .brand-left .brand-logo:last-child img {
            width: 150%;
            height: 150%;
            object-fit: cover;
            object-position: center;
        }

        .brand-text-wrap {
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            gap: 2px;
            flex: 1 1 auto;
            min-width: 0;
        }

        .brand-text-main {
            font-size: 16px;
            font-weight: 600;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .brand-text-sub {
            font-size: 13px;
            color: var(--muted);
        }

        @media (max-width: 640px) {
            .brand-left {
                gap: 10px;
            }

            .brand-logo {
                width: 82px;
                height: 60px;
            }

            .brand-text-main {
                font-size: 14px;
            }

            .brand-text-sub {
                font-size: 12px;
            }
        }

        .header-right {
            display: flex;
            align-items: center;
            gap: 10px;
            flex-wrap: wrap;
            justify-content: flex-end;
        }

        .lang-toggle {
            display: inline-flex;
            align-items: center;
            padding: 6px 14px;
            border: 1px solid var(--border-soft);
            border-radius: 999px;
            background: linear-gradient(135deg, rgba(0,160,224,0.16), rgba(230,0,126,0.08));
            color: var(--text);
            font-size: 12px;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: 0.1em;
            cursor: pointer;
            transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
        }

        .lang-toggle:focus-visible {
            outline: 2px solid var(--accent);
            outline-offset: 2px;
        }

        .lang-toggle:active {
            transform: translateY(1px);
        }

        .lang-toggle-label {
            color: var(--text);
            min-width: 26px;
            text-align: center;
        }

        :root[data-theme="light"] .lang-toggle {
            background: linear-gradient(135deg, rgba(0,160,224,0.12), rgba(230,0,126,0.06));
        }

        .header-pill {
            padding: 6px 14px;
            border-radius: 999px;
            border: 1px solid var(--border-soft);
            font-size: 12px;
            text-transform: uppercase;
            letter-spacing: 0.08em;
            color: var(--muted);
            background:
            linear-gradient(135deg, rgba(0,160,224,0.12), rgba(230,0,126,0.14));
            white-space: nowrap;
            text-align: center;     /* <<< DODANE */
        }


        /* Theme toggle */

        .theme-toggle {
            position: relative;
            display: inline-flex;
            align-items: center;
            gap: 4px;
            padding: 4px 8px;
            border-radius: 999px;
            border: 1px solid var(--border-soft);
            font-size: 11px;
            cursor: pointer;
            user-select: none;
            background: rgba(0,0,0,0.06);
        }

        :root[data-theme="light"] .theme-toggle {
            background: rgba(255,255,255,0.8);
        }

        .theme-toggle-switch {
            width: 34px;
            height: 18px;
            border-radius: 999px;
            background: var(--bg-softer);
            border: 1px solid var(--border-soft);
            position: relative;
            overflow: hidden;
        }

        .theme-toggle-knob {
            position: absolute;
            top: 1px;
            left: 1px;
            width: 14px;
            height: 14px;
            border-radius: 50%;
            background: linear-gradient(135deg, var(--accent), var(--accent-alt));
            box-shadow: 0 0 10px rgba(0,160,224,0.8);
            transition: transform 0.18s ease-out;
        }

        .theme-toggle[data-mode="light"] .theme-toggle-knob {
            transform: translateX(14px);
        }

        .theme-toggle[data-mode="dark"] .theme-toggle-knob {
            transform: translateX(0);
        }

        .theme-toggle-emoji {
            font-size: 13px;
        }

        @media (max-width: 640px) {
    header {
        flex-direction: column;
        align-items: flex-start;
    }

    .header-right {
        align-self: stretch;
        justify-content: space-between;
    }

    .header-pill {
        max-width: 100%;
        text-align: center;
        white-space: normal;
        align-self: center;
    }

    /* WYŚRODKOWANY TYTUŁ HERO NA MOBILE */
    .hero-title {
        text-align: center;
    }
}


        /* HERO */

        .hero {
            margin-top: 40px;
            display: grid;
            gap: 32px;
        }

        @media (min-width: 900px) {
            .hero {
                margin-top: 56px;
                grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
                align-items: center;
            }
        }

        .hero-kicker {
            font-size: 12px;
            letter-spacing: 0.16em;
            text-transform: uppercase;
            color: var(--muted);
            margin-bottom: 10px;
        }

        .hero-title {
            font-size: clamp(32px, 4vw, 40px);
            line-height: 1.1;
            margin: 0 0 16px;
        }


        /* =========== Oryginalny początkowy rozmiar liter tytułu ============

        .hero-title span {
            background: linear-gradient(135deg, var(--accent), var(--accent-alt));
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
        }

        ============== Koniec oryginalnego formatowania tytułu ============= */ 

        /* ============ CMYK-owy kolor i wielkość liter tutułu ============= */  

        .hero-title span {
        background: linear-gradient(135deg,#00c8ff 0%,#00c8ff 25%,#ffe600 45%,#ff2aa6 85%,#ff2aa6 100%);
        -webkit-background-clip:text;
        background-clip:text;
        color:transparent;
        white-space:nowrap;
        }

        /* ======== koniec: CMYK-owy kolor i wielkość liter tutułu ========= */


        .hero-lead {
            font-size: 16px;
            color: var(--muted);
            max-width: 520px;
            margin-bottom: 20px;
        }

        .hero-bullets {
            list-style: none;
            padding: 0;
            margin: 0 0 24px;
            display: grid;
            gap: 8px;
        }

        .hero-bullets li {
            font-size: 14px;
            color: var(--muted);
            display: flex;
            align-items: flex-start;
            gap: 8px;
        }

        .hero-bullets li::before {
            content: "";
            display: inline-block;
            margin-top: 6px;
            width: 7px;
            height: 7px;
            border-radius: 999px;
            background: linear-gradient(135deg, var(--accent), var(--accent-alt));
            box-shadow: 0 0 10px rgba(0,160,224,0.8);
        }

        .hero-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin-bottom: 16px;
        }

.btn {
    border-radius: 999px;
    padding: 10px 18px;
    font-size: 14px;
    font-weight: 500;
    border: 1px solid transparent;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-decoration: none;
}

.admin-shell .btn {
    background: transparent;
    border-color: var(--border);
    color: var(--text);
    box-shadow: none;
    padding: 8px 14px;
}

.admin-shell .btn-primary {
    background: transparent;
    border-color: var(--accent);
    color: var(--text);
}

.admin-shell .btn-primary:hover,
.admin-shell .btn-ghost:hover {
    background: var(--border-soft);
    text-decoration: none;
}

.admin-shell .btn-ghost {
    background: transparent;
    color: var(--text);
    border-color: var(--border);
}

        /* ================== BUTTON: PRIMARY ================== */
        .btn-primary {
            background: linear-gradient(
                135deg,
                var(--c-cyan) 0%,
                var(--c-cyan) 25%,   /* więcej cyanu po lewej */
                var(--c-yellow) 45%, /* wąski żółty środek */
                var(--c-magenta) 85%,
                var(--c-magenta) 100% /* więcej magenty po prawej */
            );
            color: #0a0b0e; /* light theme */
            box-shadow: var(--shadow-soft);
        }

        /* W dark theme tekst jasny */
        :root[data-theme="dark"] .btn-primary {
            color: #ffffff;
        }

        /* Hover – bez poświaty, tylko rozjaśnienie środka */
        .btn-primary:hover {
            filter: brightness(1.12);
            text-decoration: none;
        }

        .btn-ghost {
            background: transparent;
            color: var(--muted);
            border-color: var(--border-soft);
        }

        .btn-ghost:hover {
            border-color: var(--accent);
            color: var(--text-soft);
        }

        .hero-hours {
            font-size: 13px;
            color: var(--muted);
        }

        .hero-hours strong {
            color: var(--text-soft);
        }

        /* HERO IMAGE / BOX */

        .hero-aside {
            position: relative;
        }

        .hero-card {
            border-radius: 24px;
            overflow: hidden;
            background:
                radial-gradient(circle at top left, rgba(0,160,224,0.28), transparent 60%),
                radial-gradient(circle at top right, rgba(230,0,126,0.22), transparent 60%),
                #05070b;
            border: 1px solid var(--border-soft);
            box-shadow: var(--shadow-strong);
            position: relative;
            padding: 14px;
        }

        :root[data-theme="light"] .hero-card {
            background:
                radial-gradient(circle at top left, rgba(0,160,224,0.14), transparent 60%),
                radial-gradient(circle at top right, rgba(255,242,0,0.16), transparent 60%),
                #ffffff;
        }

        .hero-photo {
            border-radius: 18px;
            overflow: hidden;
            max-height: 260px;
        }

        .hero-photo img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            transform: scale(1.02);
        }

        .hero-overlay {
            position: absolute;
            inset: auto 18px 18px auto;
            border-radius: 16px;
            background: rgba(15,17,21,0.92);
            border: 1px solid rgba(255,255,255,0.12);
            padding: 10px 12px;
            font-size: 11px;
            max-width: 220px;
            color: var(--muted);
        }

        :root[data-theme="light"] .hero-overlay {
            background: rgba(245,245,247,0.96);
            border-color: rgba(0,0,0,0.08);
        }

        .hero-overlay strong {
            color: var(--text-soft);
        }

        .hero-overlay span {
            background: linear-gradient(135deg, var(--accent), var(--accent-alt));
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
        }

        /* SEKCJE */

        .section {
            margin-top: 40px;
            padding-top: 24px;
            border-top: 2px solid rgba(255,255,255,0.14);
        }

        :root[data-theme="light"] .section {
            border-top-color: rgba(0,0,0,0.14);
        }

        @media (min-width: 900px) {
            .section {
                margin-top: 48px;
            }
        }

        .section-kicker {
            font-size: 11px;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            color: var(--muted);
            margin-bottom: 6px;
        }

        .section-title {
            font-size: 22px;
            margin: 0 0 10px;
        }

        .section-lead {
            font-size: 14px;
            color: var(--muted);
            max-width: 620px;
        }

        .cards {
            margin-top: 20px;
            display: grid;
            gap: 14px;
        }

        @media (min-width: 720px) {
            .cards {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }
        }

        .card {
            border-radius: 18px;
            background: var(--bg-soft);
            border: 1px solid var(--border-soft);
            padding: 14px 16px;
            font-size: 13px;
        }

        .card-title {
            font-size: 14px;
            font-weight: 600;
            margin-bottom: 6px;
        }

        .card-tag {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            font-size: 11px;
            text-transform: uppercase;
            letter-spacing: 0.14em;
            color: var(--muted);
            margin-bottom: 8px;
        }

        .card-tag-dot {
            width: 6px;
            height: 6px;
            border-radius: 999px;
            background: linear-gradient(135deg, var(--accent), var(--accent-alt));
            box-shadow: 0 0 8px rgba(0,160,224,0.9);
        }

        .card p {
            margin: 0;
            color: var(--muted);
        }

        .section-grid {
            display: grid;
            gap: 20px;
            margin-top: 20px;
        }

        @media (min-width: 780px) {
            .section-grid {
                grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
                align-items: flex-start;
            }
        }

        .section-box {
            border-radius: 18px;
            background: var(--bg-soft);
            border: 1px solid var(--border-soft);
            padding: 16px 18px;
            font-size: 13px;
        }

        .section-box h3 {
            margin-top: 0;
            font-size: 15px;
            margin-bottom: 8px;
        }

        .section-box ul {
            padding-left: 18px;
            margin: 8px 0;
        }

        .section-box li {
            color: var(--muted);
            margin-bottom: 4px;
        }

        /* FAQ */

        .faq-list {
            display: flex;
            flex-direction: column;
            gap: 10px;
            margin-top: 16px;
        }

        .faq-item {
            border-radius: 14px;
            border: 1px solid var(--border-soft);
            background: var(--bg-soft);
            box-shadow: var(--shadow-soft);
            overflow: hidden;
        }

        .faq-item summary {
            list-style: none;
            cursor: pointer;
            padding: 14px 16px 14px 44px;
            margin: 0;
            font-weight: 600;
            color: var(--text);
            position: relative;
        }

        .faq-item summary::marker {
            content: "";
        }

        .faq-item summary::before {
            content: '▸';
            position: absolute;
            left: 16px;
            top: 50%;
            transform: translateY(-50%);
            color: var(--accent);
            transition: transform 0.18s ease-out;
        }

        .faq-item[open] summary::before {
            transform: translateY(-50%) rotate(90deg);
        }

        .faq-item summary:focus-visible {
            outline: 2px solid var(--accent);
            outline-offset: 2px;
            border-radius: 12px;
        }

        .faq-item p {
            margin: 0;
            padding: 0 16px 16px 44px;
            color: var(--muted);
        }

        .faq-item a {
            color: inherit;
            font-weight: 600;
        }

        /* KONTAKT */

        .contact-cols {
            display: grid;
            gap: 20px;
            margin-top: 20px;
        }

        @media (min-width: 720px) {
            .contact-cols {
                grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
            }
        }

        .contact-row {
            font-size: 14px;
            color: var(--muted);
            margin-bottom: 8px;
        }

        .contact-label {
            font-size: 12px;
            text-transform: uppercase;
            letter-spacing: 0.16em;
            color: var(--muted);
        }

        .contact-main {
            font-size: 15px;
            color: var(--text-soft);
        }

        .contact-main a {
            text-decoration: underline;
            text-decoration-style: dotted;
            text-decoration-thickness: 1px;
        }

        .contact-main a:hover {
            text-decoration-style: solid;
        }

        .map-link {
            margin-top: 10px;   /* 🔥 odstęp między adresem a przyciskiem */
            display: block;
            font-size: 13px;
            color: var(--muted);
        }

        /* FOOTER */

        footer {
            margin-top: 32px;
            padding-top: 16px;
            border-top: 1px solid rgba(255,255,255,0.08);
            font-size: 11px;
            color: var(--muted);
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            justify-content: space-between;
        }

        :root[data-theme="light"] footer {
            border-top-color: rgba(0,0,0,0.08);
        }

        footer a {
            color: var(--muted);
        }

    /* ==========PRZYCISK PRZEWIJANIA STRONY========== */

    .scroll-top {
        position: fixed;
        bottom: 28px;
        right: 28px;
        min-width: 64px;
        height: 34px;
        padding: 0 14px;
        border-radius: 999px; /* pałeczka jak inne przyciski */
        border: none;
        cursor: pointer;

        display: flex;
        align-items: center;
        justify-content: center;

        font-size: 18px;
        font-weight: 600;

        /* ten sam spokojniejszy CMY gradient co w .btn-primary */
        background: linear-gradient(
            135deg,
            var(--c-cyan) 0%,
            var(--c-cyan) 25%,
            var(--c-yellow) 45%,
            var(--c-magenta) 85%,
            var(--c-magenta) 100%
        );
        color: #000; /* baza pod light theme */
        box-shadow: var(--shadow-soft); /* neutralny cień, bez „aury” */

        opacity: 0;
        pointer-events: none;
        transform: translateY(8px);
        transition:
            opacity 0.25s ease,
            transform 0.25s ease,
            filter 0.25s ease;
    }

    /* Dark theme – jasny tekst */
    :root[data-theme="dark"] .scroll-top {
        color: #fff;
    }

    /* Hover – tylko rozjaśnienie, bez zewnętrznej poświaty */
    .scroll-top:hover {
        filter: brightness(1.12);
    }
.card-actions {
    margin-top: 16px;
}

.card-actions .btn {
    width: 100%;
    text-align: center;
}

.upload-hero {
    padding-bottom: 24px;
}

.upload-section {
    margin-top: 0;
}

.upload-form-card {
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 28px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.16);
}

.upload-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    position: relative;
}

.upload-form.is-loading::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.08);
    border-radius: 12px;
    backdrop-filter: blur(2px);
    z-index: 2;
}

.upload-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: stretch;
}

.upload-dropzone {
    border: 2px dashed var(--border);
    border-radius: 12px;
    padding: 20px;
    text-align: center;
    background: linear-gradient(145deg, rgba(89, 103, 255, 0.08), rgba(255, 255, 255, 0.02));
    cursor: pointer;
    transition: border-color 0.2s ease, transform 0.2s ease, background 0.2s ease;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 180px;
}

.upload-dropzone.is-dragging {
    border-color: var(--primary);
    transform: translateY(-2px);
    background: linear-gradient(145deg, rgba(89, 103, 255, 0.14), rgba(255, 255, 255, 0.04));
}

.dropzone-lead {
    font-weight: 700;
    margin-bottom: 6px;
}

.dropzone-sub {
    color: var(--muted);
    font-size: 14px;
}

.file-input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.upload-fields {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.form-field span {
    font-weight: 700;
    display: block;
    margin-bottom: 6px;
}

.form-field input,
.form-field textarea {
    width: 100%;
    padding: 12px 14px;
    border-radius: 10px;
    border: 1px solid var(--border-soft);
    background: var(--bg-softer);
    color: var(--text);
    box-shadow: inset 0 0 0 1px rgba(0,0,0,0.04);
}

.form-field textarea {
    resize: vertical;
}

.form-field input:focus,
.form-field textarea:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(0, 160, 224, 0.18);
    background: var(--bg-softer);
}

.form-field.optional span::after {
    content: ' (opcjonalnie)';
    color: var(--muted);
    font-weight: 400;
}

[data-lang="en"] .form-field.optional span::after {
    content: ' (optional)';
}

.form-checkbox {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    font-size: 15px;
}

.form-checkbox input {
    margin-top: 4px;
}

.upload-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: flex-start;
}

.mobile-file-trigger {
    display: none;
}

.upload-helper {
    color: var(--muted);
    font-size: 13px;
}

.upload-file-list ul {
    list-style: none;
    margin: 0;
    padding: 0;
    color: var(--text);
}

.upload-selected-files {
    display: grid;
    gap: 8px;
}

.upload-selected-file {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 10px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--panel-alt);
}

.upload-selected-file-name {
    min-width: 0;
    word-break: break-word;
    overflow-wrap: anywhere;
    line-height: 1.4;
}

.upload-file-remove {
    flex: 0 0 auto;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: transparent;
    color: var(--text);
    padding: 5px 9px;
    font: inherit;
    font-size: 12px;
    cursor: pointer;
}

.upload-file-remove:hover,
.upload-file-remove:focus-visible {
    border-color: var(--accent);
    color: var(--accent);
}

.form-message {
    padding: 12px 14px;
    border-radius: 10px;
    border: 1px solid var(--border);
    background: var(--panel-alt);
    color: var(--text);
}

.form-message .copy-ticket {
    margin-top: 10px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    font-size: 14px;
}

.form-message.error {
    border-color: #ff7b8a;
    background: rgba(255, 123, 138, 0.16);
    color: #ffd6dc;
}

.form-message.success {
    border-color: #7ce0a3;
    background: rgba(124, 224, 163, 0.16);
    color: #d5ffe7;
}

.panel-notice-slot {
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 8px 0 12px;
}

.panel-notice-message {
    width: fit-content;
    max-width: min(100%, 760px);
    margin: 0 auto;
    text-align: center;
    opacity: 1;
    transition: opacity 0.18s ease;
}

.panel-notice-message.is-leaving {
    opacity: 0;
}

:root[data-theme="light"] .form-message.error {
    background: #fff2f4;
    border-color: #e3445f;
    color: #7c1225;
}

:root[data-theme="light"] .form-message.success {
    background: #eefaf1;
    border-color: #49b271;
    color: #11552c;
}


.upload-alert-modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
    background: rgba(0, 0, 0, 0.48);
    backdrop-filter: blur(3px);
    z-index: 90;
}

.upload-alert-modal.is-open {
    display: flex;
}

.upload-alert-modal-content {
    width: min(420px, 100%);
    padding: 22px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--panel);
    color: var(--text);
    text-align: center;
    box-shadow: 0 22px 70px rgba(0, 0, 0, 0.38);
}

.upload-alert-modal-content p {
    margin: 0 0 18px;
    font-weight: 700;
    line-height: 1.5;
}

.form-checkbox.needs-attention {
    outline: 2px solid var(--primary);
    outline-offset: 5px;
    border-radius: 8px;
}

.upload-progress {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px;
    background: rgba(0, 0, 0, 0.08);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease, visibility 0.2s ease;
    z-index: 120;
}

.upload-progress.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
}

body.upload-in-progress {
    overflow: hidden;
}

.upload-progress-dialog {
    width: min(300px, calc(100vw - 28px));
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--panel);
    color: var(--text);
    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.32);
}

.upload-progress-spinner {
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 3px solid rgba(255,255,255,0.3);
    border-top-color: var(--accent);
    animation: spin 1s linear infinite;
}

.upload-progress-text {
    min-width: 0;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.upload-progress-title {
    font-weight: 700;
}

.upload-progress-bar {
    width: 100%;
    height: 6px;
    border-radius: 999px;
    background: var(--panel-alt);
    overflow: hidden;
    border: 1px solid var(--border);
}

.upload-progress-bar span {
    display: block;
    height: 100%;
    width: 0;
    background: linear-gradient(135deg, var(--c-cyan), var(--c-yellow), var(--c-magenta));
    transition: width 0.2s ease;
}

.upload-progress-detail {
    color: var(--muted);
    font-size: 13px;
}

@media (max-width: 420px) {
    .upload-progress {
        padding: 10px;
        background: rgba(0, 0, 0, 0.06);
    }

    .upload-progress-dialog {
        width: min(260px, calc(100vw - 24px));
        padding: 12px 14px;
        gap: 9px;
        border-radius: 11px;
    }

    .upload-progress-spinner {
        width: 26px;
        height: 26px;
        border-width: 3px;
    }

    .upload-progress-title {
        font-size: 14px;
    }

    .upload-progress-detail {
        font-size: 12px;
    }
}

.hp-field {
    position: absolute;
    left: -9999px;
}

.upload-admin-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.upload-admin-card {
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--panel);
    padding: 0;
    overflow: hidden;
}

.upload-admin-card summary {
    list-style: none;
}

.upload-admin-card summary::-webkit-details-marker {
    display: none;
}

.upload-admin-summary {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px 14px;
    cursor: pointer;
    background: var(--panel);
}

.upload-admin-summary:hover {
    background: var(--panel-alt);
}

.summary-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.summary-top {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: flex-start;
    gap: 12px;
}

.summary-left {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
    min-width: 0;
}

.summary-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
    white-space: nowrap;
    flex-shrink: 0;
}

.summary-right-line {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    white-space: nowrap;
}

.summary-right-status {
    display: flex;
    justify-content: flex-end;
    width: 100%;
}

.summary-label {
    font-weight: 700;
    white-space: nowrap;
}

.summary-ticket {
    font-weight: 800;
    letter-spacing: 0.02em;
}

.summary-value {
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.summary-notes .summary-value {
    white-space: normal;
}

.summary-notes {
    align-items: flex-start;
}

.upload-admin-content {
    padding: 0 16px 16px;
    border-top: 1px solid var(--border);
    margin-top: 4px;
}

.upload-admin-card:not([open]) .upload-admin-content {
    display: none;
}

.upload-admin-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.upload-admin-title {
    font-size: 17px;
    font-weight: 700;
}

.upload-admin-meta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    color: var(--muted);
    font-size: 13px;
}

.upload-admin-meta .meta-label {
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 700;
    color: var(--text);
}

.upload-admin-meta .meta-value {
    font-weight: 700;
}

.upload-admin-meta .badge {
    padding: 4px 8px;
    border-radius: 12px;
    border: 1px solid var(--border);
    font-size: 12px;
}

.upload-admin-body p {
    margin: 4px 0;
}

.upload-admin-files {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 10px;
}

.file-item {
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 8px 10px;
    background: var(--panel-alt);
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.file-name {
    font-weight: 700;
    word-break: break-all;
}

.file-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-end;
}

.upload-card-footer {
    margin-top: 14px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.upload-card-footer-right {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-left: auto;
}

.ticket-actions {
    display: inline-flex;
    gap: 8px;
    margin: 0;
}

.btn-small {
    padding: 8px 12px;
    font-size: 14px;
}

.admin-shell .btn-small {
    padding: 5px 9px;
    font-size: 13px;
}

.ticket-filter-inputs .btn {
    padding: 5px 9px;
    min-height: 0;
    line-height: 1.2;
    font-size: 13px;
}

.upload-bottom-actions {
    margin-top: 14px;
    display: flex;
    justify-content: center;
}

.logout-form {
    margin: 0;
}

.ticket-controls {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 6px;
}

.login-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 32px 16px;
    background: radial-gradient(circle at 20% 20%, rgba(89, 103, 255, 0.12), transparent 30%),
                radial-gradient(circle at 80% 0%, rgba(74, 222, 222, 0.10), transparent 30%),
                var(--bg);
}

.login-shell header {
    max-width: 1080px;
    margin: 0 auto 12px;
    padding: 0 6px;
    gap: 12px;
    align-items: center;
}

.login-shell .brand-left {
    justify-content: center;
    flex-wrap: wrap;
    text-align: center;
    gap: 10px;
}

.login-shell .header-right {
    gap: 10px;
}

.login-shell .header-right .header-pill {
    white-space: nowrap;
}

.login-card {
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 26px;
    width: min(480px, 100%);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.20);
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.login-brand {
    display: grid;
    grid-template-columns: 64px 1fr 64px;
    gap: 12px;
    align-items: center;
}

.login-brand img {
    width: 64px;
    height: auto;
}

.login-brand-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.login-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.login-actions {
    display: flex;
    justify-content: center;
}

.login-card h1,
.login-note {
    text-align: center;
}

.login-divider {
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, rgba(0,160,224,0.6), rgba(230,0,126,0.5));
    margin: 8px 0 12px;
    border-radius: 999px;
}

.ticket-filter {
    margin: 12px 0 18px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-width: 480px;
}

.ticket-filter label {
    font-weight: 700;
}

.ticket-filter-inputs {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.ticket-filter input[type="text"],
.ticket-filter input[type="search"] {
    flex: 1 1 180px;
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--panel);
    color: var(--text);
}

.ticket-filter input[type="text"]:focus,
.ticket-filter input[type="search"]:focus {
    outline: 2px solid var(--accent);
    outline-offset: 1px;
}


.ticket-view-switch {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 4px 0 18px;
    flex-wrap: wrap;
}

.ticket-view-tab {
    min-width: 124px;
    justify-content: center;
}

.ticket-view-count {
    display: inline-flex;
    min-width: 24px;
    height: 24px;
    margin-left: 6px;
    padding: 0 7px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(255,255,255,0.14);
    font-size: 0.82em;
    line-height: 1;
}

.ticket-view-tab.btn-ghost .ticket-view-count {
    background: var(--panel-soft, rgba(127,127,127,0.12));
}

.ticket-view-panel[hidden],
.upload-admin-card[hidden],
.ticket-filter-empty[hidden],
.customer-admin-row[hidden],
.customer-filter-empty[hidden],
#ticket-controls[hidden] {
    display: none !important;
}

.customer-controls {
    display: grid;
    gap: 8px;
    margin: 0 0 16px;
    max-width: 620px;
}
.customer-controls label,
.customer-admin-label {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--muted);
}
.customer-controls input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--panel);
    color: var(--text);
}
.customer-controls input:focus {
    outline: 2px solid var(--accent);
    outline-offset: 1px;
}
.customer-admin-list {
    display: grid;
    gap: 10px;
}
.customer-admin-row {
    display: grid;
    grid-template-columns: minmax(170px,1.2fr) minmax(190px,1.3fr) minmax(160px,1fr) minmax(230px,1.4fr);
    gap: 18px;
    align-items: start;
    padding: 14px 16px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--panel);
}
.customer-admin-contact,
.customer-admin-dates {
    display: grid;
    gap: 4px;
    min-width: 0;
    overflow-wrap: anywhere;
}
.customer-admin-name {
    min-width: 0;
    overflow-wrap: anywhere;
}
.customer-consent-ok {
    color: var(--accent);
    font-weight: 600;
}

@media (max-width: 900px) {
    .customer-admin-row {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 620px) {
    .customer-admin-row {
        grid-template-columns: 1fr;
        gap: 10px;
    }
}

@media (max-width: 720px) {
    .login-shell {
        align-items: flex-start;
        padding: 20px 12px;
    }

    .login-card {
        padding: 20px;
        width: 100%;
        border-radius: 14px;
    }

    .login-brand {
        grid-template-columns: 78px 1fr 78px;
        gap: 10px;
    }

    .login-card .brand-logo {
        width: 78px;
        height: 58px;
        padding: 5px 6px;
    }

    .theme-toggle-standalone {
        justify-content: center;
    }
}

@media (max-width: 520px) {
    .login-brand {
        grid-template-columns: 68px 1fr 68px;
        gap: 8px;
    }

    .login-card .brand-logo {
        width: 70px;
        height: 52px;
        padding: 4px 6px;
    }

    .login-brand-text .brand-text-main {
        font-size: 15px;
    }

    .login-brand-text .brand-text-sub {
        font-size: 13px;
    }
}

.back-home-link {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 10px 14px;
    border-radius: 999px;
    font-weight: 700;
    color: var(--text);
    text-decoration: none;
    border: 1px solid var(--border);
    background: var(--panel-alt);
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.back-home-link:hover,
.back-home-link:focus-visible {
    border-color: var(--primary);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    outline: none;
}

.privacy-section {
    margin-top: 32px;
}

.privacy-modal {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    backdrop-filter: blur(3px);
    display: none;
    align-items: center;
    justify-content: center;
    padding: 16px;
    z-index: 50;
}

.privacy-modal.is-open {
    display: flex;
}

.privacy-modal-content {
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: 14px;
    max-width: 720px;
    width: min(720px, 100%);
    padding: 18px;
    color: var(--text);
    box-shadow: 0 20px 60px rgba(0,0,0,0.35);
    max-height: 90vh;
    display: flex;
    flex-direction: column;
}

.privacy-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.privacy-modal-body p {
    margin: 8px 0;
}

.privacy-modal-body {
    overflow-y: auto;
    padding-right: 6px;
    max-height: 65vh;
}

.privacy-close {
    background: transparent;
    border: 1px solid var(--border-soft);
    color: var(--text);
    border-radius: 999px;
    width: 32px;
    height: 32px;
    cursor: pointer;
}

.contact-footer {
    margin-top: 32px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
    color: var(--muted);
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.contact-footer-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.contact-footer-title {
    font-weight: 700;
    color: var(--text);
}

.copyright-row {
    font-size: 12px;
}

.attention-pulse {
    animation: pulse-cta 1.4s ease-in-out infinite;
    transform-origin: center;
    box-shadow: 0 0 0 rgba(84, 108, 255, 0.0);
}

.muted {
    color: var(--muted);
}

@media (max-width: 1024px) {
    .upload-grid {
        grid-template-columns: 1fr;
    }

    .upload-dropzone {
        display: none;
    }

    .mobile-file-trigger {
        display: inline-flex;
        align-self: flex-start;
    }

    .privacy-modal-body {
        max-height: 60vh;
    }

    .upload-actions {
        align-items: center;
        width: 100%;
    }

    .upload-actions .btn {
        width: 100%;
        justify-content: center;
    }

    .form-message {
        font-size: 14px;
    }

    .form-message .copy-ticket {
        width: 100%;
        justify-content: center;
    }
}

@keyframes spin {
    from { transform: rotate(var(--rot, 0deg)); }
    to { transform: rotate(360deg); }
}

@keyframes pulse-cta {
    0% {
        filter: brightness(0.95);
        transform: scale(0.98);
        box-shadow: 0 0 0 rgba(84, 108, 255, 0.0);
    }
    50% {
        filter: brightness(1.2);
        transform: scale(1.04);
        box-shadow: 0 0 18px rgba(84, 108, 255, 0.35);
    }
    100% {
        filter: brightness(0.95);
        transform: scale(0.98);
        box-shadow: 0 0 0 rgba(84, 108, 255, 0.0);
    }
}

@media (max-width: 720px) {
    .upload-form-card {
        padding: 20px;
    }

    .upload-admin-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .upload-admin-files {
        grid-template-columns: 1fr;
    }

    .card-actions .btn {
        width: 100%;
    }
}

.theme-toggle-standalone {
    display: flex;
    justify-content: center;
    margin: 10px auto 4px;
}

.admin-shell header {
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.admin-shell .brand-left {
    flex: 1 1 240px;
}

.admin-shell .header-right {
    flex: 1 1 240px;
    justify-content: flex-end;
}

.admin-shell .header-right .header-pill {
    text-align: center;
}

@media (max-width: 900px) and (orientation: landscape) {
    .login-shell .login-card {
        margin-left: auto;
        margin-right: auto;
    }

    .login-shell .login-card {
        align-items: center;
        text-align: center;
    }

    .login-shell .login-form {
        width: 100%;
    }
}

@media (orientation: landscape) and (max-width: 900px) {
    .brand-left {
        justify-content: center;
    }

    .theme-toggle-standalone {
        justify-content: center;
    }
}

@media (max-width: 640px) {
    .admin-shell header {
        flex-direction: row;
    }

    .admin-shell .header-right {
        width: 100%;
        justify-content: flex-end;
        align-items: center;
        gap: 8px;
    }

    .admin-shell .logout-form {
        margin-left: auto;
    }

    .ticket-controls {
        align-items: center;
    }
    
}
.lang-alt {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
}

/* HOLIDAY TOP BANNER */
.holiday-top{
    width:100%;
    padding:14px 16px 8px;
}
.holiday-top .holiday-card{
    max-width: 450px;
    margin: 0 auto;
    position: relative;
    isolation: isolate;
}

/* NEW YEAR FIREWORKS (subtle particle bursts) */
.newyear-fireworks{
    position: fixed;
    inset: 0;
    z-index: 9999;
    pointer-events: none;
    overflow: visible;
    mix-blend-mode: screen;
    filter: drop-shadow(0 0 8px rgba(255, 220, 170, .22));
}

@media (prefers-reduced-motion: reduce){
    .newyear-fireworks{ display:none; }
}

.ny-burst{
    position:absolute;
    width:0;
    height:0;
    transform: translate(-50%, -50%);
}

.ny-flash{
    position:absolute;
    left:0;
    top:0;
    width:10px;
    height:10px;
    border-radius:999px;
    transform: translate(-50%, -50%) scale(.4);
    opacity:.0;
    filter: blur(.2px);
    animation: nyFlash 520ms ease-out forwards;
}

@keyframes nyFlash{
    0%{ opacity:0; transform: translate(-50%,-50%) scale(.35); }
    20%{ opacity:.55; transform: translate(-50%,-50%) scale(1.05); }
    100%{ opacity:0; transform: translate(-50%,-50%) scale(1.45); }
}

.ny-spark{
    position:absolute;
    left:0;
    top:0;
    width:5px;
    height:5px;
    border-radius:999px;
    transform: translate(-50%, -50%);
    opacity:0;
    box-shadow: 0 0 10px currentColor;
    animation: nySparkFly var(--dur, 900ms) ease-out var(--delay, 0ms) forwards;
    will-change: transform, opacity, filter;
    filter: blur(.0px);
}

.ny-spark::after{
    content:'';
    position:absolute;
    left:50%;
    top:50%;
    width:2px;
    height:12px;
    border-radius:999px;
    transform: translate(-50%,-50%) rotate(0deg);
    background: currentColor;
    opacity:.55;
    filter: blur(.35px);
}

@keyframes nySparkFly{
    0%{
        opacity:0;
        transform: translate(-50%,-50%) translate(0,0) scale(.65);
        filter: blur(.2px);
    }
    12%{
        opacity:.95;
    }
    60%{
        opacity:.85;
    }
    100%{
        opacity:0;
        transform: translate(-50%,-50%) translate(var(--dx), var(--dy)) scale(.95);
        filter: blur(.7px);
    }
}
.holiday-inner{
    border-radius: 18px;
    overflow: hidden;
    position: relative;
}
.holiday-img{
    width:100%;
    height:auto;
    display:block;
}
.holiday-logos{
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 12px;
    display:flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 12px;
    pointer-events:none;
}
.holiday-logo{
    max-height: 48px;
    width:auto;
    filter: drop-shadow(0 6px 18px rgba(0,0,0,0.55));
}

/* =========================================================
   HOLIDAY LIGHTS – dekoracyjne lampki wokół kartki
   - kolory świąteczne
   - 4 strony (góra / dół / lewa / prawa)
   - blisko krawędzi obrazka, w jego otoczce
   ========================================================= */

/* Otoczka lampek */
.holiday-lights{
    position:absolute;
    top: -4px;
    left: -4px;
    right: -4px;
    bottom: -4px;
    border-radius: 22px;
    pointer-events:none;
    z-index: 3;
}

/* Kolory świąteczne */
:root{
    --bulb-red:   #e63946;
    --bulb-green: #2ecc71;
    --bulb-gold:  #ffd166;
    --bulb-blue:  #4dabf7;
}

.holiday-bulb{
    position:absolute;
    width: 9px;
    height: 9px;
    border-radius: 999px;
    opacity: .30;
    animation: holidayTwinkle 3.6s ease-in-out infinite;
}
.holiday-bulb.red{
    background: var(--bulb-red);
    box-shadow: 0 0 10px rgba(230,57,70,.70);
}
.holiday-bulb.green{
    background: var(--bulb-green);
    box-shadow: 0 0 10px rgba(46,204,113,.70);
}
.holiday-bulb.gold{
    background: var(--bulb-gold);
    box-shadow: 0 0 10px rgba(255,209,102,.70);
}
.holiday-bulb.blue{
    background: var(--bulb-blue);
    box-shadow: 0 0 10px rgba(77,171,247,.70);
}

@keyframes holidayTwinkle{
    0%,100%{ opacity:.18; transform:scale(.90); }
    45%{ opacity:.70; transform:scale(1.10); }
    65%{ opacity:.32; transform:scale(1.00); }
}

/* ===== GÓRA ===== */
.holiday-bulb.b1{top:4px;left:6%;}
.holiday-bulb.b2{top:4px;left:18%;animation-delay:-1.1s;}
.holiday-bulb.b3{top:4px;left:30%;animation-delay:-2.4s;}
.holiday-bulb.b4{top:4px;left:42%;animation-delay:-0.6s;}
.holiday-bulb.b5{top:4px;left:54%;animation-delay:-1.9s;}
.holiday-bulb.b6{top:4px;left:66%;animation-delay:-3.0s;}
.holiday-bulb.b7{top:4px;left:78%;animation-delay:-1.5s;}
.holiday-bulb.b8{top:4px;left:90%;animation-delay:-2.7s;}

/* ===== DÓŁ ===== */
.holiday-bulb.b9{bottom:4px;left:8%;animation-delay:-2.1s;}
.holiday-bulb.b10{bottom:4px;left:22%;animation-delay:-0.9s;}
.holiday-bulb.b11{bottom:4px;left:36%;animation-delay:-3.3s;}
.holiday-bulb.b12{bottom:4px;left:50%;animation-delay:-1.8s;}
.holiday-bulb.b13{bottom:4px;left:64%;animation-delay:-2.6s;}
.holiday-bulb.b14{bottom:4px;left:78%;animation-delay:-0.4s;}
.holiday-bulb.b15{bottom:4px;left:90%;animation-delay:-1.2s;}

/* ===== LEWA ===== */
.holiday-bulb.b16{left:4px;top:12%;animation-delay:-2.9s;}
.holiday-bulb.b17{left:4px;top:28%;animation-delay:-1.3s;}
.holiday-bulb.b18{left:4px;top:44%;animation-delay:-2.1s;}
.holiday-bulb.b19{left:4px;top:60%;animation-delay:-0.8s;}
.holiday-bulb.b20{left:4px;top:76%;animation-delay:-1.9s;}

/* ===== PRAWA ===== */
.holiday-bulb.b21{right:4px;top:14%;animation-delay:-2.4s;}
.holiday-bulb.b22{right:4px;top:30%;animation-delay:-0.6s;}
.holiday-bulb.b23{right:4px;top:46%;animation-delay:-1.6s;}
.holiday-bulb.b24{right:4px;top:62%;animation-delay:-2.8s;}
.holiday-bulb.b25{right:4px;top:78%;animation-delay:-1.2s;}

/* Mobile sizing */
@media (max-width: 520px){
    .holiday-logo{ max-height: 34px; }
    .holiday-top{ padding:12px 12px 6px; }
    .holiday-lights{ top:-3px; left:-3px; right:-3px; bottom:-3px; }
    .holiday-bulb{ width: 7px; height: 7px; }
}


/* ROOT (/) – strona wyboru języka */
.root-home .page {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.root-home header,
.root-home .root-header {
    width: 100%;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    gap: 18px;
}

.root-home .brand-left {
    justify-content: center;
}

.root-home .theme-toggle {
    justify-content: center;
}

.root-choice {
    width: 100%;
}

.root-choice-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
}

.root-title {
    font-weight: 700;
    letter-spacing: 0.08em;
    font-size: 22px;
}

.root-subtitle {
    font-weight: 600;
    font-size: 16px;
    opacity: 0.95;
}

.root-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 6px;
}

/* Panel zleceń: własne potwierdzenie trwałego usunięcia */
.ticket-delete-modal {
    position: fixed;
    inset: 0;
    z-index: 220;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
    background: rgba(0, 0, 0, 0.42);
    backdrop-filter: blur(2px);
}

.ticket-delete-modal.is-open {
    display: flex;
}

.ticket-delete-dialog {
    width: min(390px, 100%);
    padding: 22px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--panel);
    color: var(--text);
    text-align: center;
    box-shadow: 0 22px 70px rgba(0, 0, 0, 0.38);
}

.ticket-delete-dialog h2 {
    margin: 0 0 10px;
    font-size: 1.25rem;
}

.ticket-delete-dialog p {
    margin: 0;
    line-height: 1.5;
}

.ticket-delete-dialog .ticket-delete-number {
    display: block;
    margin-bottom: 8px;
    font-weight: 800;
}

.ticket-delete-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 20px;
    flex-wrap: wrap;
}

@media (max-width: 520px) {
    .ticket-delete-dialog {
        width: min(330px, 100%);
        padding: 20px;
    }

    .ticket-delete-actions {
        flex-direction: column-reverse;
    }

    .ticket-delete-actions .btn {
        width: 100%;
    }
}

/* Panel zleceń: konflikty w książce klientów */
.customer-conflict-tab-count {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 6px;
    font-weight: 800;
}

.customer-conflicts {
    margin: 0 0 18px;
    padding: 16px;
    border: 1px solid rgba(245, 158, 11, 0.55);
    border-radius: 14px;
    background: rgba(245, 158, 11, 0.08);
}

.customer-conflicts-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 6px;
}

.customer-conflicts-title span {
    min-width: 28px;
    height: 28px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(245, 158, 11, 0.18);
    font-weight: 800;
}

.customer-conflict-row {
    margin-top: 12px;
    border: 1px solid rgba(245, 158, 11, 0.35);
    border-radius: 12px;
    background: var(--panel);
    overflow: hidden;
}

.customer-conflict-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 14px;
    cursor: pointer;
    list-style: none;
}

.customer-conflict-summary::-webkit-details-marker {
    display: none;
}

.customer-conflict-summary::after {
    content: '⌄';
    flex: 0 0 auto;
    font-size: 1.15rem;
    line-height: 1;
    color: var(--muted);
    transition: transform .18s ease;
}

.customer-conflict-row[open] > .customer-conflict-summary::after {
    transform: rotate(180deg);
}

.customer-conflict-summary-main,
.customer-conflict-summary-meta {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 5px 10px;
}

.customer-conflict-summary-main {
    min-width: 0;
    flex: 1 1 auto;
}

.customer-conflict-summary-meta {
    flex: 0 1 auto;
    justify-content: flex-end;
}

.customer-conflict-summary-meta span,
.customer-conflict-preview {
    font-size: 0.88rem;
    opacity: 0.72;
}

.customer-conflict-preview {
    overflow-wrap: anywhere;
}

.customer-conflict-body {
    display: grid;
    gap: 8px;
    padding: 0 14px 14px;
    border-top: 1px solid rgba(245, 158, 11, 0.22);
}

.customer-conflict-body > div:not(.customer-conflict-actions) {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    padding-top: 10px;
}

/* v0.34 – narzędzia rozwiązywania konfliktów książki klientów */
.customer-conflict-actions {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(127, 127, 127, 0.22);
}

.customer-conflict-action-form {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 8px;
}

.customer-conflict-target {
    display: grid;
    gap: 5px;
    min-width: min(320px, 100%);
    flex: 1 1 320px;
}

.customer-conflict-target span {
    font-size: 0.78rem;
    color: var(--muted);
}

.customer-conflict-target select {
    width: 100%;
    min-height: 38px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--panel);
    color: var(--text);
    padding: 7px 10px;
}

.customer-conflict-help {
    margin: 8px 0 0;
    font-size: 0.78rem;
    color: var(--muted);
}

@media (max-width: 680px) {
    .customer-conflict-action-form {
        align-items: stretch;
    }

    .customer-conflict-action-form .btn,
    .customer-conflict-target {
        width: 100%;
    }
}

/* v0.36 – zarządzanie książką klientów */
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.customer-bulk-form {
    display: grid;
    gap: 12px;
}

.customer-bulk-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--panel);
}

.customer-select-all,
.customer-row-select {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    cursor: pointer;
}

.customer-select-all input,
.customer-row-select input {
    width: 18px;
    height: 18px;
    accent-color: var(--accent);
    cursor: pointer;
}

.customer-selected-count {
    color: var(--muted);
    font-size: 0.86rem;
}

.customer-bulk-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-left: auto;
}

.customer-admin-row {
    grid-template-columns: 34px minmax(170px,1.2fr) minmax(190px,1.3fr) minmax(160px,1fr) minmax(230px,1.4fr);
}

.customer-admin-row.is-editing {
    border-color: rgba(46, 125, 50, .5);
    box-shadow: 0 0 0 2px rgba(46, 125, 50, .08);
}

.customer-display-value {
    display: grid;
    gap: 4px;
}

.customer-edit-field {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.customer-edit-field[hidden],
.customer-edit-actions[hidden],
.customer-display-value[hidden] {
    display: none !important;
}

.customer-edit-field input,
.customer-edit-field textarea {
    width: 100%;
    min-width: 0;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--panel);
    color: var(--text);
    padding: 8px 10px;
    font: inherit;
}

.customer-edit-field textarea {
    resize: vertical;
    line-height: 1.35;
}

.customer-edit-field input:focus,
.customer-edit-field textarea:focus {
    outline: 2px solid var(--accent);
    outline-offset: 1px;
}

.customer-edit-help {
    color: var(--muted);
    font-size: .75rem;
    line-height: 1.35;
}

.customer-edit-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

.customer-row-select {
    min-height: 24px;
    align-self: start;
    padding-top: 1px;
}

@media (max-width: 900px) {
    .customer-admin-row {
        grid-template-columns: 34px 1fr 1fr;
    }
    .customer-admin-dates {
        grid-column: 2 / -1;
    }
}

@media (max-width: 620px) {
    .customer-bulk-actions {
        width: 100%;
        margin-left: 0;
    }
    .customer-bulk-actions .btn {
        flex: 1 1 180px;
    }
    .customer-admin-row {
        grid-template-columns: 30px 1fr;
    }
    .customer-admin-name,
    .customer-admin-contact,
    .customer-admin-dates {
        grid-column: 2;
    }
}

/* v0.39 — jawne tworzenie odrębnego klienta przy konflikcie */
.customer-conflict-separate {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid rgba(120, 120, 120, .28);
}
.customer-conflict-check {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: 8px 0;
    cursor: pointer;
}
.customer-conflict-check input {
    margin-top: .2em;
}

/* v0.40 — rotacja zleceń, zlecenia cykliczne i wiadomości do klienta */
.ticket-operational-tools {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 14px;
    padding: 12px 14px;
    border: 1px solid rgba(46, 125, 50, .28);
    border-radius: 12px;
    background: rgba(46, 125, 50, .045);
}

.ticket-recurring-form {
    margin: 0;
}

.ticket-recurring-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-weight: 600;
}

.ticket-recurring-label input {
    width: 18px;
    height: 18px;
}

.badge.recurring {
    margin-left: 8px;
    border-color: rgba(46, 125, 50, .45);
}

.badge.notified {
    margin-left: 0;
}

.retention-settings-card {
    max-width: 760px;
    padding: 22px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--panel, rgba(255,255,255,.04));
}

.retention-settings-card h2 {
    margin-top: 0;
}

.retention-settings-form {
    display: grid;
    gap: 16px;
    margin-top: 18px;
}

.retention-settings-form > label {
    display: grid;
    gap: 7px;
    font-weight: 600;
}

.retention-input {
    display: flex;
    align-items: center;
    gap: 10px;
}

.retention-input input {
    width: 120px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--surface, transparent);
    color: inherit;
}

.completion-message-modal {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0,0,0,.58);
}

.completion-message-modal.is-open {
    display: flex;
}

.completion-message-modal-content {
    width: min(680px, 100%);
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    padding: 24px;
    border-radius: 16px;
    background: var(--bg, #fff);
    border: 1px solid var(--border);
    box-shadow: 0 24px 70px rgba(0,0,0,.28);
}

.completion-message-modal-content h2 {
    margin-top: 0;
}

.completion-message-modal-content .form-field {
    display: grid;
    gap: 6px;
    margin-bottom: 14px;
}

.completion-message-modal-content .form-field input,
.completion-message-modal-content .form-field textarea {
    width: 100%;
}

.completion-message-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px;
}

.completion-sender-note {
    margin: 14px 0 0;
    font-size: .9rem;
}

@media (max-width: 720px) {
    .ticket-operational-tools {
        align-items: stretch;
        flex-direction: column;
    }
    .ticket-operational-tools .btn {
        width: 100%;
    }
}

/* v0.46 — czytelny status powiadomienia i blokada wielokrotnego wysyłania */
.badge.notified {
    display: inline-flex;
    align-items: center;
    margin-left: 0;
    padding: 4px 9px;
    border: 1px solid #9ccdab;
    border-radius: 999px;
    background: #f2f8f3;
    color: #2f8a4d;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.2;
    white-space: nowrap;
}

:root[data-theme="dark"] .badge.notified {
    border-color: #476f52;
    background: #1e2b22;
    color: #9dd7ad;
}

#completion-message-form[aria-busy="true"] button[type="submit"] {
    cursor: wait;
    opacity: .72;
}


/* v0.54 — podgląd wpisywanego hasła */
.password-input-wrap{
    position:relative;
    display:block;
    width:100%;
}
.password-input-wrap > input{
    width:100%;
    padding-right:44px !important;
}
.password-toggle{
    position:absolute;
    top:50%;
    right:7px;
    transform:translateY(-50%);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:32px;
    height:32px;
    padding:0;
    border:0;
    border-radius:7px;
    background:transparent;
    color:var(--muted);
    cursor:pointer;
}
.password-toggle:hover,
.password-toggle:focus-visible{
    background:rgba(127,127,127,.12);
    color:var(--text);
    outline:none;
}
.password-toggle svg{
    width:20px;
    height:20px;
    display:block;
}


/* v0.55 — trwałe ostrzeżenie o niewysłanym mailu początkowym */
.mail-failure-badges{
    gap:6px;
    flex-wrap:wrap;
}
.badge.mail-failed{
    display:inline-flex;
    align-items:center;
    padding:4px 9px;
    border:1px solid #e0ad7a;
    border-radius:999px;
    background:#fff6ed;
    color:#9a4f08;
    font-size:12px;
    font-weight:600;
    line-height:1.2;
    white-space:nowrap;
}
.mail-status-alert{
    margin:0 0 16px;
    padding:11px 13px;
    border:1px solid #e0ad7a;
    border-radius:12px;
    background:#fff8f1;
    color:#6f3b0a;
    line-height:1.45;
}
:root[data-theme="dark"] .badge.mail-failed{
    border-color:#7d5a39;
    background:#34281d;
    color:#f0bc83;
}
:root[data-theme="dark"] .mail-status-alert{
    border-color:#705134;
    background:#2e251d;
    color:#efc392;
}

/* ======================================================================
   7minut.pl public front — v1.0.0-beta.2
   Evolution of the temporary 7minut.pl visual language: warm gradients,
   framed imagery, small cards and a quiet rhythm. Scoped to .seven-public.
   ====================================================================== */

.seven-public{
    --seven-cyan:#00a0e0;
    --seven-cyan-hot:#00c8ff;
    --seven-magenta:#e6007e;
    --seven-magenta-hot:#ff2aa6;
    --seven-yellow:#fff200;
    --seven-bg:#0c0e12;
    --seven-surface:#111523;
    --seven-surface-2:#171b28;
    --seven-text:#f6f7fb;
    --seven-text-soft:#e3e4eb;
    --seven-muted:#a5a9b8;
    --seven-line:rgba(255,255,255,.12);
    --seven-line-soft:rgba(255,255,255,.075);
    --seven-glass:rgba(16,19,29,.74);
    --seven-shadow:0 18px 42px rgba(0,0,0,.48);
    --seven-shadow-soft:0 10px 28px rgba(0,0,0,.28);
    margin:0;
    min-height:100vh;
    color:var(--seven-text);
    background:
        radial-gradient(900px 700px at -5% -2%,rgba(0,160,224,.24),transparent 62%),
        radial-gradient(900px 650px at 104% 2%,rgba(230,0,126,.20),transparent 65%),
        radial-gradient(700px 600px at 52% 44%,rgba(255,242,0,.035),transparent 70%),
        var(--seven-bg);
    background-attachment:fixed;
    font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    text-rendering:optimizeLegibility;
}
:root[data-theme="light"] .seven-public{
    --seven-bg:#f5f6fa;
    --seven-surface:#fff;
    --seven-surface-2:#f2f4f9;
    --seven-text:#15161b;
    --seven-text-soft:#303340;
    --seven-muted:#6d7280;
    --seven-line:rgba(20,23,32,.13);
    --seven-line-soft:rgba(20,23,32,.075);
    --seven-glass:rgba(255,255,255,.78);
    --seven-shadow:0 18px 40px rgba(30,38,65,.13);
    --seven-shadow-soft:0 10px 25px rgba(30,38,65,.09);
    background:
        radial-gradient(900px 720px at -6% -2%,rgba(0,160,224,.18),transparent 62%),
        radial-gradient(900px 650px at 106% 0%,rgba(230,0,126,.12),transparent 64%),
        radial-gradient(760px 620px at 54% 43%,rgba(255,242,0,.12),transparent 72%),
        var(--seven-bg);
    background-attachment:fixed;
}
.seven-public *, .seven-public *::before,.seven-public *::after{box-sizing:border-box}
.seven-public a{color:inherit;text-decoration:none}
.seven-public button,.seven-public input,.seven-public textarea,.seven-public select{font:inherit}
.seven-public img{max-width:100%}
.seven-public ::selection{background:rgba(0,200,255,.3)}
.seven-skip{position:fixed;left:12px;top:-70px;z-index:1000;background:#fff;color:#111!important;padding:10px 14px;border-radius:0 0 10px 10px;transition:top .15s}
.seven-skip:focus{top:0}

.seven-page{width:min(1160px,calc(100% - 28px));margin:0 auto;padding:24px 0 42px}
.seven-header{display:flex;align-items:center;justify-content:space-between;gap:18px;position:relative;z-index:40}
.seven-brand-block{display:flex;align-items:center;gap:14px;min-width:0}
.seven-logo-frame{
    width:94px;height:66px;flex:0 0 94px;border-radius:20px;padding:6px 8px;overflow:hidden;
    display:flex;align-items:center;justify-content:center;background:
        radial-gradient(circle at 50% 0,rgba(255,242,0,.18),transparent 62%),#eef1f8;
    border:1px solid rgba(90,100,120,.18);box-shadow:var(--seven-shadow-soft);
    transition:transform .22s ease,box-shadow .22s ease;
}
.seven-brand-block:hover .seven-logo-frame:first-child{transform:translateY(-2px) rotate(-.5deg)}
.seven-logo-frame img{display:block;width:100%;height:100%;object-fit:contain}
.seven-logo-compaan img{width:145%;height:145%;max-width:none;object-fit:cover}
.seven-brand-copy{display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;min-width:180px}
.seven-brand-copy strong{font-size:15px;letter-spacing:.09em;font-weight:700}
.seven-brand-copy small{font-size:12px;color:var(--seven-muted);line-height:1.35}
.seven-header-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.seven-lang,.seven-theme,.seven-menu-toggle{
    min-height:38px;border:1px solid var(--seven-line);border-radius:999px;background:var(--seven-glass);
    color:var(--seven-text);display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:7px 12px;
    font-weight:720;font-size:12px;letter-spacing:.045em;cursor:pointer;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);
    box-shadow:0 5px 18px rgba(0,0,0,.09);transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.seven-lang:hover,.seven-theme:hover,.seven-menu-toggle:hover{transform:translateY(-1px);border-color:rgba(0,160,224,.48)}
.seven-menu-toggle i{width:16px;height:10px;position:relative;display:block;border-top:2px solid currentColor;border-bottom:2px solid currentColor}
.seven-menu-toggle i::after{content:"";position:absolute;left:0;right:0;top:3px;border-top:2px solid currentColor}
.seven-theme-label{font-weight:650}

.seven-nav{margin:18px 0 0;position:relative;z-index:35}
.seven-nav-inner{
    display:flex;align-items:center;gap:5px;min-height:52px;padding:6px;border:1px solid var(--seven-line-soft);border-radius:17px;
    background:var(--seven-glass);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 10px 28px rgba(0,0,0,.10)
}
.seven-nav a,.seven-nav-parent{border:0;background:transparent;color:var(--seven-text-soft);padding:10px 12px;border-radius:11px;font-size:13px;font-weight:680;white-space:nowrap;cursor:pointer;transition:background .18s ease,color .18s ease,transform .18s ease}
.seven-nav a:hover,.seven-nav-parent:hover{background:rgba(255,255,255,.055);color:var(--seven-text);transform:translateY(-1px)}
:root[data-theme="light"] .seven-nav a:hover,:root[data-theme="light"] .seven-nav-parent:hover{background:rgba(20,23,32,.055)}
.seven-nav-upload{margin-left:auto!important;background:linear-gradient(110deg,rgba(0,160,224,.18),rgba(230,0,126,.15))!important;border:1px solid rgba(0,160,224,.22)!important}
.seven-nav-group{position:relative}
.seven-nav-parent{display:flex;align-items:center;gap:7px}
.seven-nav-parent span{font-size:15px;line-height:1;transition:transform .18s ease}.seven-nav-group.is-open .seven-nav-parent span{transform:rotate(180deg)}
.seven-submenu{position:absolute;top:calc(100% + 9px);left:0;min-width:230px;padding:7px;display:none;border:1px solid var(--seven-line);border-radius:15px;background:var(--seven-surface);box-shadow:var(--seven-shadow);z-index:60}
.seven-nav-group.is-open .seven-submenu,.seven-nav-group:hover .seven-submenu{display:grid;gap:2px}
.seven-submenu a{white-space:normal}

.seven-public main{padding:0 2px}
.seven-hero{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(330px,.92fr);gap:52px;align-items:center;padding:72px 18px 68px;min-height:570px}
.seven-hero:not(.has-media){grid-template-columns:minmax(0,820px);min-height:420px;padding-top:88px;padding-bottom:78px}
.seven-hero-copy{min-width:0}
.seven-kicker,.seven-mini-kicker{font-size:11px;text-transform:uppercase;letter-spacing:.15em;color:var(--seven-muted);font-weight:800;margin-bottom:10px}
.seven-hero-title{margin:0;font-size:clamp(46px,6.1vw,86px);line-height:.98;letter-spacing:-.055em;max-width:850px}
.seven-hero-title span,.seven-title.huge{
    background:linear-gradient(105deg,var(--seven-cyan-hot) 0%,var(--seven-cyan-hot) 27%,#5d8ee9 48%,var(--seven-magenta-hot) 83%,var(--seven-magenta-hot) 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
}
.seven-lead{font-size:clamp(18px,2vw,24px);line-height:1.52;color:var(--seven-text-soft);max-width:720px;margin-top:24px}
.seven-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.seven-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 16px;border-radius:999px;border:1px solid var(--seven-line);background:var(--seven-glass);color:var(--seven-text);font-size:13px;font-weight:760;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.seven-btn:hover{transform:translateY(-2px);border-color:rgba(0,160,224,.52);box-shadow:0 9px 25px rgba(0,0,0,.12)}
.seven-btn.primary{background:linear-gradient(120deg,rgba(0,160,224,.94),rgba(71,135,215,.95) 52%,rgba(230,0,126,.90));border-color:transparent;color:white;box-shadow:0 10px 28px rgba(0,160,224,.16)}
.seven-btn.small{min-height:38px;padding:8px 13px;font-size:12px}
.seven-photo-frame{position:relative;padding:14px;border-radius:28px;border:1px solid var(--seven-line);background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.025));box-shadow:var(--seven-shadow);isolation:isolate;transform:rotate(.65deg)}
:root[data-theme="light"] .seven-photo-frame{background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(239,242,249,.88))}
.seven-photo-glow{position:absolute;inset:-30px;z-index:-1;background:radial-gradient(circle at 30% 25%,rgba(0,160,224,.22),transparent 48%),radial-gradient(circle at 75% 75%,rgba(230,0,126,.18),transparent 45%);filter:blur(24px)}
.seven-photo{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:20px;box-shadow:0 8px 24px rgba(0,0,0,.22)}
.seven-photo-mark{position:absolute;left:28px;bottom:26px;padding:7px 11px;border-radius:999px;background:rgba(7,10,16,.74);color:#f8f9fc;font-size:11px;font-weight:760;letter-spacing:.04em;backdrop-filter:blur(10px)}

.seven-section{position:relative;padding:58px 18px 66px;border-top:1px solid var(--seven-line-soft)}
.seven-section::before{content:"";position:absolute;width:90px;height:1px;left:18px;top:-1px;background:linear-gradient(90deg,var(--seven-cyan),var(--seven-magenta),transparent)}
.seven-section.compact{padding-top:30px}
.seven-title{font-size:clamp(31px,4.4vw,56px);line-height:1.03;letter-spacing:-.04em;margin:0;max-width:930px}
.seven-copy{font-size:clamp(16px,1.8vw,20px);line-height:1.65;color:var(--seven-text-soft);max-width:850px;margin-top:18px}
.seven-copy a,.seven-article-body a{color:var(--seven-cyan-hot);font-weight:700;text-decoration:underline;text-decoration-color:rgba(0,160,224,.32);text-underline-offset:3px}
.seven-section-action{margin-top:24px}
.seven-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:30px}
.seven-card-grid-auto{grid-template-columns:repeat(3,minmax(0,1fr))}
.seven-card{min-height:150px;border:1px solid var(--seven-line);border-radius:20px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));padding:20px 21px;box-shadow:0 9px 25px rgba(0,0,0,.08);transition:transform .22s ease,border-color .22s ease,background .22s ease}
:root[data-theme="light"] .seven-card{background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(246,247,251,.85))}
.seven-card:hover{transform:translateY(-3px);border-color:rgba(0,160,224,.33)}
.seven-card h3{font-size:19px;margin:0 0 9px;letter-spacing:-.02em}
.seven-card p{margin:0;color:var(--seven-text-soft);line-height:1.56;font-size:15px}
.seven-card-index{display:block;font-size:11px;color:var(--seven-muted);font-weight:800;letter-spacing:.1em;margin-bottom:18px}
.seven-card-soft:nth-child(3n+2){transform:translateY(8px)}.seven-card-soft:nth-child(3n+2):hover{transform:translateY(5px)}
.seven-section-text,.seven-section-text_media,.seven-section-cta{max-width:980px;margin-left:auto;margin-right:auto}
.seven-section-text .seven-copy,.seven-section-cta .seven-copy{max-width:820px}
.seven-section-cta{margin-top:20px;margin-bottom:20px;padding:34px 36px;border:1px solid var(--seven-line);border-radius:24px;background:linear-gradient(125deg,rgba(0,160,224,.09),rgba(230,0,126,.075))}
.seven-section-cta::before{display:none}
.seven-inline-media{margin-top:28px;padding:10px;border:1px solid var(--seven-line);border-radius:22px;background:rgba(255,255,255,.035)}
.seven-inline-media img{display:block;width:100%;max-height:560px;object-fit:cover;border-radius:16px}

.seven-article-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:30px}
.seven-article-card{display:block;min-height:250px;padding:18px;border:1px solid var(--seven-line);border-radius:20px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));transition:transform .22s ease,border-color .22s ease;overflow:hidden}
:root[data-theme="light"] .seven-article-card{background:rgba(255,255,255,.82)}
.seven-article-card:hover{transform:translateY(-4px);border-color:rgba(230,0,126,.35)}
.seven-article-card img{width:calc(100% + 36px);max-width:none;height:175px;object-fit:cover;margin:-18px -18px 18px;border-bottom:1px solid var(--seven-line-soft)}
.seven-article-card h2,.seven-article-card h3{font-size:21px;line-height:1.15;letter-spacing:-.025em;margin:0 0 10px}
.seven-article-card p{color:var(--seven-muted);line-height:1.52;margin:0 0 18px;font-size:14px}
.seven-card-link{display:inline-flex;margin-top:auto;font-size:12px;font-weight:800;color:var(--seven-text-soft)}
.seven-news-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:28px}
.seven-news-card{padding:17px 18px;border:1px solid var(--seven-line);border-radius:18px;background:rgba(255,255,255,.035);min-height:160px;transition:transform .2s ease,border-color .2s ease}
.seven-news-card:hover{transform:translateY(-3px);border-color:rgba(0,160,224,.34)}
.seven-news-card h3{font-size:18px;line-height:1.17;margin:0 0 8px}.seven-news-card p{margin:0;color:var(--seven-muted);font-size:13px;line-height:1.48}

.seven-contact-grid{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(340px,1.1fr);gap:16px;margin-top:28px}
.seven-contact-card,.seven-map{border:1px solid var(--seven-line);border-radius:22px;background:rgba(255,255,255,.035);overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.07)}
:root[data-theme="light"] .seven-contact-card,:root[data-theme="light"] .seven-map{background:rgba(255,255,255,.82)}
.seven-contact-card{padding:22px;display:grid;gap:16px;align-content:start}
.seven-contact-card>div{display:grid;gap:3px}.seven-contact-card span{font-size:11px;text-transform:uppercase;letter-spacing:.11em;color:var(--seven-muted);font-weight:800}.seven-contact-card strong,.seven-contact-card a{font-size:16px;line-height:1.42;font-weight:680}
.seven-contact-card a:hover{color:var(--seven-cyan-hot)}
.seven-map iframe{display:block;width:100%;height:100%;min-height:360px;border:0;filter:saturate(.9)}

.seven-page-head{padding:82px 18px 44px;max-width:1010px}.seven-page-head .seven-copy{max-width:760px}
.seven-title.huge{font-size:clamp(46px,7vw,88px);line-height:.98;letter-spacing:-.055em;margin:0;max-width:1050px}
.seven-article{max-width:900px;margin:0 auto;padding:82px 18px 80px}
.seven-article-lead{font-size:clamp(19px,2.3vw,26px);line-height:1.5;color:var(--seven-text-soft);margin:24px 0 0;max-width:760px}
.seven-article-image{margin:36px 0;padding:10px;border:1px solid var(--seven-line);border-radius:24px}.seven-article-image img{display:block;width:100%;max-height:620px;object-fit:cover;border-radius:17px}
.seven-article-body{margin-top:42px;font-size:18px;line-height:1.72;color:var(--seven-text-soft);max-width:780px}
.seven-article-body h2{color:var(--seven-text);font-size:28px;line-height:1.18;letter-spacing:-.025em;margin:42px 0 14px}.seven-article-body p{margin:0 0 20px}
.seven-back{display:inline-flex;margin-top:35px;padding:9px 13px;border-radius:999px;border:1px solid var(--seven-line);font-size:13px;font-weight:730}
.seven-news-list{display:grid;gap:10px}.seven-news-wide{display:grid;grid-template-columns:100px minmax(0,1fr) 28px;gap:18px;align-items:center;padding:18px 20px;border:1px solid var(--seven-line);border-radius:18px;background:rgba(255,255,255,.03);transition:transform .18s,border-color .18s}
.seven-news-wide:hover{transform:translateX(4px);border-color:rgba(0,160,224,.33)}.seven-news-wide>span{font-size:11px;color:var(--seven-muted);font-weight:800;letter-spacing:.07em}.seven-news-wide h2{font-size:20px;margin:0 0 4px}.seven-news-wide p{margin:0;color:var(--seven-muted);line-height:1.45;font-size:14px}.seven-news-wide b{font-size:21px;font-weight:400}
.seven-state{min-height:540px;padding:100px 18px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;max-width:760px}.seven-state-code{font-size:12px;letter-spacing:.15em;color:var(--seven-muted);font-weight:800}.seven-state h1{font-size:clamp(42px,7vw,76px);letter-spacing:-.05em;line-height:1;margin:10px 0 18px}.seven-state p{font-size:18px;line-height:1.6;color:var(--seven-text-soft);max-width:630px;margin:0 0 24px}

.seven-footer{margin-top:30px;border:1px solid var(--seven-line-soft);border-radius:26px;background:rgba(12,15,23,.46);overflow:hidden;backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px)}
:root[data-theme="light"] .seven-footer{background:rgba(255,255,255,.62)}
.seven-footer-main{display:grid;grid-template-columns:1.35fr .9fr .75fr;gap:36px;padding:32px}
.seven-footer-about>strong{font-size:24px;letter-spacing:-.03em}.seven-footer-about p{max-width:480px;color:var(--seven-muted);line-height:1.55;font-size:14px}
.seven-footer-logos{display:flex;gap:10px;margin-top:18px}.seven-footer-logos .seven-logo-frame{width:78px;height:54px;flex-basis:78px;border-radius:15px;box-shadow:none}
.seven-footer-contact,.seven-footer-links{display:grid;align-content:start;gap:9px}.seven-footer-contact a,.seven-footer-contact span,.seven-footer-links a{font-size:13px;line-height:1.45;color:var(--seven-text-soft)}.seven-footer-links a:hover,.seven-footer-contact a:hover{color:var(--seven-cyan-hot)}
.seven-footer-note{border-top:1px solid var(--seven-line-soft);padding:13px 32px;color:var(--seven-muted);font-size:11px}.seven-copyright{border-top:1px solid var(--seven-line-soft);padding:12px 32px;text-align:center;color:var(--seven-muted);font-size:11px}

@media (max-width:980px){
    .seven-page{width:min(100% - 22px,1160px)}
    .seven-brand-copy{display:none}.seven-logo-frame{width:82px;height:58px;flex-basis:82px;border-radius:17px}
    .seven-nav-inner{overflow-x:auto;scrollbar-width:none}.seven-nav-inner::-webkit-scrollbar{display:none}
    .seven-hero{grid-template-columns:1fr 380px;gap:30px;padding-left:10px;padding-right:10px}.seven-hero-title{font-size:clamp(44px,7vw,68px)}
    .seven-card-grid-auto{grid-template-columns:repeat(2,minmax(0,1fr))}.seven-article-grid,.seven-news-row{grid-template-columns:repeat(2,minmax(0,1fr))}
    .seven-footer-main{grid-template-columns:1.2fr 1fr;}.seven-footer-links{grid-column:1/-1;grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:760px){
    .seven-page{width:calc(100% - 18px);padding-top:10px;padding-bottom:20px}
    .seven-header{align-items:flex-start}.seven-brand-block{gap:7px}.seven-logo-frame{width:62px;height:48px;flex-basis:62px;border-radius:14px;padding:5px}.seven-logo-frame.seven-logo-compaan{display:none}
    .seven-header-tools{gap:5px}.seven-theme-label{display:none}.seven-lang,.seven-theme,.seven-menu-toggle{min-height:36px;padding:6px 10px}.seven-menu-toggle span{display:none}
    .seven-nav{margin-top:10px;display:none}.seven-nav.is-open{display:block}.seven-nav-inner{display:grid;gap:3px;padding:7px;overflow:visible}.seven-nav a,.seven-nav-parent{width:100%;justify-content:space-between;text-align:left;padding:10px}.seven-nav-upload{margin-left:0!important;text-align:center!important}.seven-submenu{position:static;min-width:0;margin:2px 4px 7px;box-shadow:none;background:rgba(255,255,255,.03)}.seven-nav-group:hover .seven-submenu{display:none}.seven-nav-group.is-open .seven-submenu{display:grid}
    .seven-hero,.seven-hero:not(.has-media){grid-template-columns:1fr;min-height:0;padding:54px 8px 48px;gap:32px}.seven-hero-title{font-size:clamp(41px,12vw,58px);line-height:1}.seven-lead{font-size:18px;line-height:1.55;margin-top:18px}.seven-actions{margin-top:22px}
    .seven-photo-frame{width:min(100%,480px);margin:0 auto;padding:10px;border-radius:23px;transform:none}.seven-photo{border-radius:16px}.seven-photo-mark{left:20px;bottom:19px}
    .seven-section{padding:44px 8px 50px}.seven-section::before{left:8px}.seven-title{font-size:34px}.seven-copy{font-size:17px;margin-top:15px}.seven-card-grid,.seven-card-grid-auto,.seven-article-grid,.seven-news-row{grid-template-columns:1fr;gap:10px}.seven-card{min-height:0;padding:18px}.seven-card-soft:nth-child(3n+2),.seven-card-soft:nth-child(3n+2):hover{transform:none}.seven-section-cta{padding:26px 22px;border-radius:20px}
    .seven-contact-grid{grid-template-columns:1fr}.seven-map iframe{min-height:300px}.seven-page-head{padding:58px 8px 26px}.seven-title.huge{font-size:47px}.seven-article{padding:58px 8px}.seven-article-lead{font-size:19px}.seven-article-body{font-size:17px}.seven-article-body h2{font-size:25px}.seven-news-wide{grid-template-columns:72px 1fr 20px;gap:10px;padding:15px}.seven-news-wide p{display:none}
    .seven-footer{border-radius:20px}.seven-footer-main{grid-template-columns:1fr;gap:25px;padding:24px 20px}.seven-footer-links{grid-column:auto;grid-template-columns:1fr 1fr}.seven-footer-note,.seven-copyright{padding-left:20px;padding-right:20px}
}
@media (max-width:430px){.seven-footer-links{grid-template-columns:1fr}.seven-article-card{min-height:0}.seven-news-wide{grid-template-columns:1fr 20px}.seven-news-wide>span{grid-column:1/-1}.seven-state{min-height:440px;padding:70px 8px}.seven-state h1{font-size:48px}}
@media (prefers-reduced-motion:reduce){.seven-public *{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.seven-photo-frame{transform:none}}