/* ProClubGaming Black Pro Design v0.23.0 */
:root {
    --bg: #020812 !important;
    --card: rgba(5, 17, 32, .88) !important;
    --text: #eaf7ff !important;
    --muted: #92a7b8 !important;
    --line: rgba(77, 203, 255, .22) !important;
    --brand: #00c8ff !important;
    --brand-bg: rgba(0, 200, 255, .10) !important;
    --good: #22c55e !important;
    --warn: #f59e0b !important;
    --danger: #ff4d6d !important;
    --pcg-cyan: #00d9ff;
    --pcg-blue: #0b8cff;
    --pcg-green: #15e58c;
    --pcg-purple: #9b5cff;
    --pcg-surface-1: rgba(2, 12, 24, .96);
    --pcg-surface-2: rgba(7, 24, 43, .86);
    --pcg-glow: 0 0 30px rgba(0, 200, 255, .18), 0 0 80px rgba(0, 120, 255, .10);
}

* {
    box-sizing: border-box;
}

html {
    background: #020812;
}

body {
    margin: 0;
    background:
        radial-gradient(circle at 74% 0%, rgba(0, 200, 255, .24), transparent 28rem),
        radial-gradient(circle at 15% 18%, rgba(0, 102, 255, .16), transparent 24rem),
        radial-gradient(circle at 48% 100%, rgba(0, 255, 208, .08), transparent 28rem),
        linear-gradient(135deg, #020812 0%, #041321 44%, #020710 100%) !important;
    color: var(--text) !important;
    min-height: 100vh;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(77, 203, 255, .045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(77, 203, 255, .04) 1px, transparent 1px);
    background-size: 64px 64px;
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.55), transparent 70%);
    z-index: -1;
}

.header {
    position: sticky !important;
    top: 0;
    z-index: 50;
    background: rgba(2, 9, 18, .82) !important;
    border-bottom: 1px solid rgba(0, 200, 255, .22) !important;
    padding: 14px 32px !important;
    backdrop-filter: blur(18px);
    box-shadow: 0 18px 60px rgba(0, 0, 0, .32);
}

.brand {
    color: var(--text) !important;
    text-decoration: none !important;
    font-size: 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.brand-logo img,
.brand img {
    display: block;
    height: 48px;
    width: auto;
    max-width: 260px;
    object-fit: contain;
    filter: drop-shadow(0 0 18px rgba(0, 217, 255, .24));
}

.brand:not(.brand-logo)::before {
    content: "";
    width: 46px;
    height: 46px;
    display: inline-block;
    background: url("/assets/brand/pcg-controller-icon-transparent-1024.png") center / contain no-repeat;
    filter: drop-shadow(0 0 12px rgba(0, 217, 255, .35));
}

.brand span {
    color: var(--pcg-cyan) !important;
}

.nav {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.nav a {
    color: #dbefff !important;
    text-decoration: none !important;
    margin-left: 10px !important;
    font-weight: 750 !important;
    font-size: 14px;
    padding: 9px 12px;
    border-radius: 999px;
    border: 1px solid transparent;
    transition: .18s ease;
}

.nav a:hover {
    color: #ffffff !important;
    border-color: rgba(0, 200, 255, .35);
    background: rgba(0, 200, 255, .10);
    box-shadow: 0 0 22px rgba(0, 200, 255, .10);
}

.logout-form span {
    color: var(--muted);
}

.main {
    max-width: 1440px !important;
    margin: 0 auto !important;
    padding: 26px 22px 70px !important;
}

.card {
    background:
        linear-gradient(145deg, rgba(9, 28, 50, .90), rgba(3, 13, 25, .90)) !important;
    border: 1px solid rgba(77, 203, 255, .20) !important;
    border-radius: 22px !important;
    box-shadow: 0 22px 70px rgba(0, 0, 0, .36), var(--pcg-glow) !important;
    color: var(--text) !important;
    overflow: hidden;
}

.card:first-child {
    position: relative;
    background:
        radial-gradient(circle at 82% 20%, rgba(0, 200, 255, .22), transparent 22rem),
        linear-gradient(135deg, rgba(7, 28, 52, .96), rgba(2, 10, 20, .94)) !important;
}

.card:first-child::after {
    content: "";
    position: absolute;
    right: -90px;
    top: -120px;
    width: 360px;
    height: 360px;
    background: url("/assets/brand/pcg-controller-icon-transparent-1024.png") center / contain no-repeat;
    opacity: .11;
    filter: blur(.2px) drop-shadow(0 0 40px rgba(0, 217, 255, .40));
    pointer-events: none;
}

h1, h2, h3 {
    color: #f4fbff !important;
    letter-spacing: -0.035em;
}

h1 {
    font-size: clamp(36px, 5.2vw, 72px) !important;
    line-height: .96 !important;
}

p, small, .footer {
    color: var(--muted) !important;
}

a {
    color: var(--pcg-cyan);
}

.badge {
    background: rgba(0, 200, 255, .10) !important;
    color: #80ecff !important;
    border: 1px solid rgba(0, 200, 255, .34) !important;
    box-shadow: inset 0 0 20px rgba(0, 200, 255, .05);
    text-transform: uppercase;
    letter-spacing: .06em;
}

button, .button {
    background: linear-gradient(135deg, #008cff, #00d9ff) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, .12) !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 30px rgba(0, 140, 255, .22), inset 0 1px 0 rgba(255,255,255,.2);
    font-weight: 850 !important;
    transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

button:hover, .button:hover {
    transform: translateY(-1px);
    filter: brightness(1.08);
    box-shadow: 0 18px 40px rgba(0, 200, 255, .26);
}

button.secondary, .button.secondary {
    background: rgba(8, 26, 46, .88) !important;
    color: #e8f8ff !important;
    border: 1px solid rgba(77, 203, 255, .28) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

input, textarea, select {
    background: rgba(0, 9, 18, .68) !important;
    color: #f0fbff !important;
    border: 1px solid rgba(77, 203, 255, .26) !important;
    border-radius: 14px !important;
    outline: none;
}

input:focus, textarea:focus, select:focus {
    border-color: rgba(0, 217, 255, .72) !important;
    box-shadow: 0 0 0 4px rgba(0, 217, 255, .10);
}

input::placeholder {
    color: rgba(219, 239, 255, .52);
}

.metric,
.table,
table {
    background: rgba(2, 12, 24, .44) !important;
    border-color: rgba(77, 203, 255, .18) !important;
}

.metric {
    border: 1px solid rgba(77, 203, 255, .18) !important;
    border-radius: 16px !important;
}

.metric strong {
    color: #ffffff;
}

.table th,
.table td {
    border-bottom: 1px solid rgba(77, 203, 255, .14) !important;
}

.table th {
    color: #8edfff !important;
}

code {
    background: rgba(0, 200, 255, .10) !important;
    color: #bff6ff !important;
    border: 1px solid rgba(0, 200, 255, .18);
}

.footer {
    border-top: 1px solid rgba(77, 203, 255, .16);
    padding-top: 20px;
}

.footer::before {
    content: "";
    display: block;
    width: min(280px, 70vw);
    height: 90px;
    background: url("/assets/brand/pcg-controller-logo-full.png") center / contain no-repeat;
    margin: 0 auto 12px;
    opacity: .95;
    filter: drop-shadow(0 0 20px rgba(0, 217, 255, .20));
}

@media (max-width: 860px) {
    .header {
        padding: 12px 16px !important;
        align-items: flex-start;
        gap: 12px;
        flex-wrap: wrap;
    }

    .brand-logo img,
    .brand img {
        height: 40px;
        max-width: 210px;
    }

    .nav {
        width: 100%;
        overflow-x: auto;
        padding-bottom: 4px;
        flex-wrap: nowrap;
    }

    .nav a {
        white-space: nowrap;
        margin-left: 0 !important;
    }

    .main {
        padding: 16px 12px 48px !important;
    }

    .card {
        border-radius: 18px !important;
        padding: 18px !important;
    }

    .card:first-child::after {
        width: 240px;
        height: 240px;
        right: -80px;
        top: -70px;
        opacity: .10;
    }
}

@media (max-width: 520px) {
    .brand-logo img,
    .brand img {
        height: 36px;
        max-width: 180px;
    }

    h1 {
        font-size: 34px !important;
    }

    .card {
        padding: 16px !important;
    }
}

/* Grace Anchorwoman Integration v0.23.1 */
.pcg-grace-hero-wrap {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
    gap: 22px;
    align-items: stretch;
}

.pcg-grace-visual {
    position: relative;
    min-height: 520px;
    border-radius: 24px;
    border: 1px solid rgba(0, 217, 255, .24);
    background:
        radial-gradient(circle at 50% 18%, rgba(0, 217, 255, .28), transparent 20rem),
        linear-gradient(145deg, rgba(0, 19, 40, .92), rgba(1, 7, 15, .96));
    overflow: hidden;
    box-shadow: inset 0 0 70px rgba(0, 217, 255, .08), 0 24px 80px rgba(0,0,0,.36);
}

.pcg-grace-visual::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(2,8,18,.82) 0%, rgba(2,8,18,.18) 44%, rgba(0,200,255,.08) 100%),
        linear-gradient(rgba(0, 217, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 217, 255, .045) 1px, transparent 1px);
    background-size: auto, 44px 44px, 44px 44px;
    z-index: 1;
}

.pcg-grace-visual img {
    position: absolute;
    right: -32px;
    bottom: -24px;
    height: 108%;
    max-height: 680px;
    width: auto;
    z-index: 2;
    object-fit: contain;
    filter: drop-shadow(0 0 28px rgba(0,217,255,.24));
}

.pcg-grace-card {
    position: absolute;
    left: 22px;
    top: 22px;
    width: min(330px, calc(100% - 44px));
    z-index: 3;
    padding: 18px;
    border-radius: 20px;
    border: 1px solid rgba(0, 217, 255, .34);
    background: rgba(1, 13, 27, .74);
    backdrop-filter: blur(14px);
    box-shadow: 0 22px 70px rgba(0,0,0,.32);
}

.pcg-grace-card h3 {
    margin: 6px 0 8px;
    font-size: 24px;
}

.pcg-grace-card ul {
    margin: 14px 0 0;
    padding: 0;
    list-style: none;
}

.pcg-grace-card li {
    margin: 9px 0;
    color: #dff8ff;
    font-weight: 650;
}

.pcg-grace-card li::before {
    content: "✓";
    color: #20f5a2;
    margin-right: 8px;
}

.pcg-grace-mini {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    border: 1px solid rgba(0,217,255,.26);
    border-radius: 999px;
    background: rgba(0, 16, 32, .62);
    box-shadow: 0 0 34px rgba(0,217,255,.10);
}

.pcg-grace-mini img {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    object-fit: cover;
    border: 1px solid rgba(0,217,255,.42);
}

.pcg-grace-ai-section {
    position: relative;
    min-height: 390px;
    overflow: hidden;
    background:
        radial-gradient(circle at 82% 28%, rgba(0, 217, 255, .24), transparent 23rem),
        linear-gradient(135deg, rgba(0, 19, 40, .96), rgba(1, 7, 15, .96)) !important;
}

.pcg-grace-ai-section::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: min(360px, 48vw);
    height: 100%;
    background: url("/assets/brand/grace-anchorwoman-card.jpg") right bottom / contain no-repeat;
    z-index: 1;
    filter: drop-shadow(0 0 22px rgba(0,217,255,.20));
}

.pcg-grace-ai-content {
    position: relative;
    z-index: 2;
    max-width: 760px;
    padding-right: min(320px, 38vw);
}

.pcg-grace-ai-content .pcg-feature-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 14px;
    margin-top: 18px;
}

.pcg-grace-ai-content .pcg-feature {
    border: 1px solid rgba(0,217,255,.22);
    border-radius: 16px;
    padding: 16px;
    background: rgba(0,0,0,.18);
}

@media (max-width: 1024px) {
    .pcg-grace-hero-wrap {
        grid-template-columns: 1fr;
    }

    .pcg-grace-visual {
        min-height: 460px;
    }

    .pcg-grace-visual img {
        right: 0;
        height: 103%;
    }

    .pcg-grace-card {
        max-width: 320px;
    }

    .pcg-grace-ai-content {
        padding-right: min(260px, 35vw);
    }
}

@media (max-width: 680px) {
    .pcg-grace-visual {
        min-height: 520px;
    }

    .pcg-grace-visual img {
        height: 72%;
        right: -38px;
        bottom: 0;
    }

    .pcg-grace-card {
        left: 14px;
        top: 14px;
        width: calc(100% - 28px);
        padding: 14px;
    }

    .pcg-grace-card h3 {
        font-size: 20px;
    }

    .pcg-grace-mini {
        width: 100%;
        justify-content: flex-start;
        border-radius: 18px;
    }

    .pcg-grace-ai-section {
        min-height: 620px;
        padding-bottom: 250px !important;
    }

    .pcg-grace-ai-section::after {
        width: 260px;
        height: 300px;
        right: -6px;
        bottom: 0;
    }

    .pcg-grace-ai-content {
        padding-right: 0;
    }
}

/* Grace AI Showcase Graphics v0.23.2 */
.pcg-showcase-section {
    position: relative;
    overflow: hidden;
    padding: 18px !important;
    background:
        radial-gradient(circle at 70% 30%, rgba(0, 217, 255, .16), transparent 26rem),
        linear-gradient(145deg, rgba(2, 12, 24, .96), rgba(1, 6, 13, .96)) !important;
}

.pcg-showcase-frame {
    position: relative;
    display: block;
    width: 100%;
    border-radius: 24px;
    overflow: hidden;
    border: 1px solid rgba(0, 217, 255, .34);
    background: rgba(0, 0, 0, .42);
    box-shadow:
        0 28px 90px rgba(0,0,0,.42),
        0 0 60px rgba(0, 217, 255, .13),
        inset 0 0 50px rgba(0, 217, 255, .06);
}

.pcg-showcase-frame img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.pcg-showcase-overlay {
    position: absolute;
    left: 18px;
    bottom: 18px;
    z-index: 3;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.pcg-showcase-overlay .button,
.pcg-showcase-overlay .button.secondary {
    backdrop-filter: blur(12px);
}

.pcg-showcase-caption {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    padding: 14px 4px 12px;
}

.pcg-showcase-caption h2 {
    margin: 0;
}

.pcg-showcase-caption p {
    margin: 4px 0 0;
}

.pcg-showcase-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 12px;
    border-radius: 999px;
    border: 1px solid rgba(0,217,255,.28);
    background: rgba(0, 12, 24, .72);
    color: #dff8ff;
    font-weight: 800;
}

.pcg-showcase-badge img {
    width: 34px;
    height: 34px;
    object-fit: cover;
    border-radius: 999px;
    border: 1px solid rgba(0,217,255,.38);
}

@media (max-width: 960px) {
    .pcg-showcase-section {
        padding: 14px !important;
    }

    .pcg-showcase-frame {
        border-radius: 20px;
    }

    .pcg-showcase-frame img {
        aspect-ratio: 16 / 10;
    }

    .pcg-showcase-overlay {
        position: static;
        padding: 12px 0 0;
    }
}

@media (max-width: 620px) {
    .pcg-showcase-section {
        padding: 10px !important;
    }

    .pcg-showcase-frame {
        border-radius: 18px;
    }

    .pcg-showcase-frame img {
        aspect-ratio: 4 / 5;
        object-fit: cover;
        object-position: center;
    }

    .pcg-showcase-caption {
        display: block;
    }

    .pcg-showcase-overlay {
        display: grid;
        grid-template-columns: 1fr;
    }

    .pcg-showcase-overlay .button,
    .pcg-showcase-overlay .button.secondary {
        width: 100%;
        text-align: center;
    }
}

/* Startpage polish v0.23.3 – graphics replace duplicate text blocks */
.pcg-start-hero-card {
    min-height: auto;
}

.pcg-entry-card,
.pcg-showcase-matchops,
.pcg-showcase-assistant {
    margin-top: 22px;
}

.pcg-showcase-matchops .pcg-showcase-caption p,
.pcg-showcase-assistant .pcg-showcase-caption p {
    max-width: 860px;
}

@media (min-width: 1100px) {
    .pcg-showcase-matchops .pcg-showcase-frame img,
    .pcg-showcase-assistant .pcg-showcase-frame img {
        max-height: 760px;
    }
}

@media (max-width: 620px) {
    .pcg-showcase-matchops .pcg-showcase-caption h2,
    .pcg-showcase-assistant .pcg-showcase-caption h2 {
        font-size: 24px !important;
    }

    .pcg-showcase-matchops .pcg-showcase-caption p,
    .pcg-showcase-assistant .pcg-showcase-caption p {
        font-size: 15px;
    }
}

/* Startpage Pro Flow v0.23.5.2 */
.pcg-top-portal-menu {
    display: grid;
    grid-template-columns: minmax(220px, .8fr) minmax(380px, 1.5fr) minmax(260px, .85fr);
    gap: 18px;
    align-items: center;
    margin-bottom: 22px;
    padding: 18px !important;
}

.pcg-top-portal-left h2 {
    margin: 8px 0 4px;
}

.pcg-top-portal-left p {
    margin: 0;
}

.pcg-top-portal-links {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
    justify-content: center;
}

.pcg-top-portal-links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 13px;
    border-radius: 999px;
    color: #e8f8ff !important;
    text-decoration: none !important;
    border: 1px solid rgba(77, 203, 255, .22);
    background: rgba(0, 15, 30, .52);
    font-weight: 800;
    font-size: 14px;
}

.pcg-top-portal-links a:hover {
    background: rgba(0, 200, 255, .12);
    border-color: rgba(0, 217, 255, .42);
}

.pcg-top-portal-account {
    display: grid;
    grid-template-columns: 44px 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid rgba(0,217,255,.22);
    border-radius: 18px;
    background: rgba(0, 12, 24, .50);
}

.pcg-top-portal-account img {
    width: 44px;
    height: 44px;
    object-fit: cover;
    border-radius: 999px;
    border: 1px solid rgba(0,217,255,.34);
}

.pcg-top-portal-account strong {
    color: #ffffff;
    display: block;
}

.pcg-top-portal-account small {
    display: block;
    line-height: 1.25;
}

.pcg-start-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr);
    gap: 22px;
    align-items: start;
}

.pcg-hero-search {
    margin: 22px 0;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.pcg-hero-search input {
    flex: 1;
    min-width: 260px;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 16px;
    font-size: 17px;
}

.pcg-hero-account-panel {
    position: sticky;
    top: 92px;
}

.pcg-entry-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.pcg-ai-sidepanel {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(340px, .88fr);
    gap: 20px;
    align-items: center;
    padding: 18px !important;
    margin-top: 22px;
}

.pcg-ai-sidepanel-copy {
    padding: 8px 8px 8px 0;
}

.pcg-ai-sidepanel-copy h2 {
    font-size: clamp(28px, 3.2vw, 46px) !important;
    margin: 10px 0;
}

.pcg-ai-sidepanel-copy p {
    font-size: 17px;
}

.pcg-ai-mini-steps {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 18px 0;
}

.pcg-ai-mini-steps span {
    display: inline-flex;
    padding: 9px 11px;
    border: 1px solid rgba(0,217,255,.26);
    border-radius: 999px;
    color: #dff8ff;
    background: rgba(0, 15, 30, .54);
    font-weight: 800;
    font-size: 13px;
}

.pcg-ai-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 18px;
}

.pcg-ai-sidepanel-media {
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(0,217,255,.28);
    background: rgba(0,0,0,.35);
    box-shadow: 0 24px 70px rgba(0,0,0,.34), 0 0 46px rgba(0,217,255,.10);
}

.pcg-ai-sidepanel-media img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    object-position: center;
}

@media (min-width: 1180px) {
    .pcg-ai-sidepanel-media img {
        max-height: 420px;
    }
}

.pcg-content-two-col {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 22px;
    margin-top: 22px;
}

@media (max-width: 1080px) {
    .pcg-top-portal-menu {
        grid-template-columns: 1fr;
    }

    .pcg-top-portal-links {
        justify-content: flex-start;
    }

    .pcg-start-hero-grid {
        grid-template-columns: 1fr;
    }

    .pcg-hero-account-panel {
        position: static;
    }

    .pcg-entry-grid {
        grid-template-columns: 1fr;
    }

    .pcg-ai-sidepanel {
        grid-template-columns: 1fr;
    }

    .pcg-ai-sidepanel-copy {
        padding: 0;
    }

    .pcg-ai-sidepanel-media img {
        aspect-ratio: 16 / 9;
        max-height: none;
    }

    .pcg-content-two-col {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .pcg-top-portal-menu {
        padding: 14px !important;
    }

    .pcg-top-portal-links {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .pcg-top-portal-links a {
        font-size: 13px;
        padding: 10px;
    }

    .pcg-top-portal-account {
        grid-template-columns: 38px 1fr;
    }

    .pcg-top-portal-account .button {
        grid-column: 1 / -1;
        text-align: center;
    }

    .pcg-ai-sidepanel {
        padding: 14px !important;
        gap: 14px;
    }

    .pcg-ai-sidepanel-media img {
        aspect-ratio: 4 / 5;
    }

    .pcg-ai-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .pcg-ai-actions .button,
    .pcg-ai-actions .button.secondary {
        text-align: center;
        width: 100%;
    }
}

/* Header + Grace image fit fix v0.23.5.3 */

/* Top header: weniger Leerraum, bessere Zentrierung */
body > header {
    min-height: 74px !important;
    padding: 12px clamp(18px, 4vw, 64px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    background:
        linear-gradient(180deg, rgba(2, 8, 17, .98), rgba(1, 6, 14, .94)) !important;
    border-bottom: 1px solid rgba(0, 217, 255, .20) !important;
    box-shadow: 0 12px 44px rgba(0,0,0,.26) !important;
}

body > header a:first-child,
body > header .brand,
body > header .logo,
body > header .pcg-brand {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 48px !important;
}

body > header img {
    max-height: 46px !important;
    width: auto !important;
    object-fit: contain !important;
    object-position: center !important;
    display: block !important;
}

body > header nav,
body > header .nav,
body > header .pcg-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: clamp(16px, 2vw, 34px) !important;
    margin-left: auto !important;
}

body > header nav a,
body > header .nav a,
body > header .pcg-nav a {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 38px !important;
    padding: 8px 2px !important;
    color: #f4fbff !important;
    font-weight: 900 !important;
    letter-spacing: .01em !important;
    text-decoration: none !important;
    opacity: .96 !important;
}

body > header nav a:hover,
body > header .nav a:hover,
body > header .pcg-nav a:hover {
    color: #35d9ff !important;
}

/* Oberes Portal-Menü: ruhiger, nicht so zerstreut */
.pcg-top-portal-menu {
    grid-template-columns: minmax(230px, .78fr) minmax(420px, 1.44fr) minmax(300px, .78fr) !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 16px 18px !important;
    margin-top: 18px !important;
}

.pcg-top-portal-left h2 {
    font-size: 22px !important;
    line-height: 1.12 !important;
}

.pcg-top-portal-left p {
    font-size: 15px !important;
}

.pcg-top-portal-links {
    align-items: center !important;
    justify-content: center !important;
}

.pcg-top-portal-links a {
    min-height: 38px !important;
    white-space: nowrap !important;
}

.pcg-top-portal-account {
    justify-self: end !important;
    width: min(100%, 350px) !important;
}

/* Hero: weniger wuchtig, mehr Landingpage-Balance */
.pcg-start-hero-card {
    padding: clamp(22px, 3vw, 34px) !important;
}

.pcg-start-hero-card h1 {
    font-size: clamp(38px, 4.8vw, 64px) !important;
    letter-spacing: -.04em !important;
    max-width: 940px !important;
}

.pcg-start-hero-grid {
    grid-template-columns: minmax(0, 1.52fr) minmax(300px, .68fr) !important;
    align-items: center !important;
}

.pcg-hero-account-panel > div {
    padding: 20px !important;
}

/* Grace/KI-Grafiken: vollständig sichtbar, kein Crop */
.pcg-ai-sidepanel {
    grid-template-columns: minmax(0, 1.18fr) minmax(330px, .82fr) !important;
    align-items: center !important;
}

.pcg-ai-sidepanel-media {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 0 !important;
    padding: 10px !important;
    background:
        radial-gradient(circle at 70% 35%, rgba(0, 217, 255, .14), transparent 18rem),
        rgba(0,0,0,.52) !important;
}

.pcg-ai-sidepanel-media img,
.pcg-showcase-frame img {
    object-fit: contain !important;
    object-position: center center !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    aspect-ratio: auto !important;
    border-radius: 16px !important;
}

/* Desktop: rechts kompakt, aber komplett sichtbar */
@media (min-width: 1180px) {
    .pcg-ai-sidepanel-media img {
        max-height: 360px !important;
    }

    .pcg-ai-sidepanel-copy h2 {
        font-size: clamp(30px, 3vw, 44px) !important;
    }
}

/* Große Screens: nicht unnötig aufblasen */
@media (min-width: 1500px) {
    .pcg-ai-sidepanel-media img {
        max-height: 380px !important;
    }
}

/* Tablet: Menü stapeln, Bilder vollständig behalten */
@media (max-width: 1080px) {
    body > header {
        min-height: 68px !important;
        padding: 10px 18px !important;
    }

    body > header img {
        max-height: 40px !important;
    }

    .pcg-top-portal-menu {
        grid-template-columns: 1fr !important;
    }

    .pcg-top-portal-links {
        justify-content: flex-start !important;
    }

    .pcg-top-portal-account {
        justify-self: stretch !important;
        width: 100% !important;
    }

    .pcg-start-hero-grid {
        grid-template-columns: 1fr !important;
    }

    .pcg-ai-sidepanel {
        grid-template-columns: 1fr !important;
    }

    .pcg-ai-sidepanel-media img {
        max-height: none !important;
        object-fit: contain !important;
    }
}

/* Handy: Header und Buttons sauber umbrechen, Grace nie abschneiden */
@media (max-width: 620px) {
    body > header {
        min-height: auto !important;
        padding: 10px 14px !important;
        flex-wrap: wrap !important;
    }

    body > header img {
        max-height: 36px !important;
    }

    body > header nav,
    body > header .nav,
    body > header .pcg-nav {
        width: 100% !important;
        justify-content: space-between !important;
        gap: 10px !important;
    }

    body > header nav a,
    body > header .nav a,
    body > header .pcg-nav a {
        font-size: 13px !important;
        min-height: 30px !important;
    }

    .pcg-start-hero-card h1 {
        font-size: clamp(34px, 11vw, 48px) !important;
    }

    .pcg-top-portal-links {
        grid-template-columns: 1fr 1fr !important;
    }

    .pcg-ai-sidepanel-media {
        padding: 8px !important;
    }

    .pcg-ai-sidepanel-media img,
    .pcg-showcase-frame img {
        object-fit: contain !important;
        aspect-ratio: auto !important;
        max-height: none !important;
    }
}

/* Portrait AI showcase images v0.23.6 */
.pcg-ai-sidepanel {
    grid-template-columns: minmax(0, 1.18fr) minmax(280px, .62fr) !important;
}

.pcg-ai-sidepanel-media {
    min-height: 0 !important;
    padding: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.pcg-ai-sidepanel-media img {
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 560px !important;
    object-fit: contain !important;
    object-position: center center !important;
    aspect-ratio: auto !important;
    border-radius: 18px !important;
}

@media (min-width: 1180px) {
    .pcg-ai-sidepanel-media img {
        max-height: 520px !important;
    }

    .pcg-ai-sidepanel {
        grid-template-columns: minmax(0, 1.22fr) minmax(300px, .58fr) !important;
    }
}

@media (min-width: 1500px) {
    .pcg-ai-sidepanel-media img {
        max-height: 580px !important;
    }
}

@media (max-width: 1080px) {
    .pcg-ai-sidepanel {
        grid-template-columns: 1fr !important;
    }

    .pcg-ai-sidepanel-media img {
        width: auto !important;
        max-width: min(100%, 520px) !important;
        max-height: none !important;
        margin: 0 auto !important;
    }
}

@media (max-width: 620px) {
    .pcg-ai-sidepanel-media {
        padding: 8px !important;
    }

    .pcg-ai-sidepanel-media img {
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* Public landing/header robust v0.23.9.2 */
body > header {
    min-height: 72px !important;
    padding: 10px clamp(16px, 4vw, 58px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
}

body > header .brand-logo,
body > header a.brand-logo {
    display: inline-flex !important;
    align-items: center !important;
    flex: 0 0 auto !important;
}

body > header .brand-logo img,
body > header a.brand-logo img {
    max-height: 52px !important;
    width: auto !important;
    object-fit: contain !important;
}

body > header nav.pcg-public-header-nav,
body > header .nav.pcg-public-header-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
    gap: clamp(10px, 1.7vw, 22px) !important;
    margin-left: auto !important;
}

body > header nav.pcg-public-header-nav a,
body > header .nav.pcg-public-header-nav a {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 38px !important;
    padding: 8px 0 !important;
    color: #eaf8ff !important;
    text-decoration: none !important;
    font-weight: 900 !important;
    letter-spacing: .01em !important;
    opacity: .95 !important;
}

body > header nav.pcg-public-header-nav a:hover,
body > header .nav.pcg-public-header-nav a:hover {
    color: #36dcff !important;
}

body > header nav.pcg-public-header-nav a.pcg-header-login-link,
body > header .nav.pcg-public-header-nav a.pcg-header-login-link {
    padding: 10px 14px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(0,217,255,.34) !important;
    background: rgba(0, 217, 255, .10) !important;
    box-shadow: 0 0 24px rgba(0,217,255,.08) !important;
}

main.container,
.container {
    padding-top: 22px !important;
}

.pcg-grace-first-hero-2392 {
    display: grid;
    grid-template-columns: minmax(0, 1.04fr) minmax(320px, .76fr);
    gap: clamp(22px, 4vw, 48px);
    align-items: center;
    overflow: hidden;
    padding: clamp(24px, 4vw, 52px) !important;
    min-height: min(760px, calc(100vh - 120px));
    background:
        radial-gradient(circle at 82% 35%, rgba(0,217,255,.18), transparent 30rem),
        radial-gradient(circle at 18% 18%, rgba(0,120,255,.12), transparent 26rem),
        linear-gradient(145deg, rgba(2, 12, 24, .96), rgba(1, 6, 14, .98)) !important;
}

.pcg-grace-first-copy-2392 h1 {
    font-size: clamp(40px, 5.2vw, 78px) !important;
    line-height: .96 !important;
    letter-spacing: -.055em !important;
    margin: 14px 0 18px !important;
    max-width: 1000px;
}

.pcg-grace-lead-2392 {
    font-size: clamp(18px, 1.5vw, 23px);
    line-height: 1.55;
    max-width: 840px;
    color: #cfe7f5;
}

.pcg-grace-primary-actions-2392,
.pcg-grace-secondary-actions-2392,
.pcg-search-actions-2392 {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.pcg-grace-primary-actions-2392 {
    margin: 26px 0 16px;
}

.pcg-grace-secondary-actions-2392 a {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 9px 13px;
    border-radius: 999px;
    border: 1px solid rgba(0,217,255,.22);
    background: rgba(0, 15, 30, .48);
    color: #e8f8ff !important;
    text-decoration: none !important;
    font-weight: 800;
}

.pcg-grace-first-visual-2392 {
    position: relative;
    min-height: 560px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pcg-grace-photo-shell-2392 {
    position: relative;
    width: min(100%, 460px);
    border-radius: 34px;
    overflow: hidden;
    border: 1px solid rgba(0,217,255,.35);
    background:
        radial-gradient(circle at 50% 20%, rgba(0,217,255,.20), transparent 22rem),
        rgba(0,0,0,.36);
    box-shadow: 0 30px 90px rgba(0,0,0,.42), 0 0 70px rgba(0,217,255,.14);
}

.pcg-grace-photo-shell-2392 img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 620px;
    object-fit: contain;
    object-position: center bottom;
}

.pcg-grace-greeting-card-2392 {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 22px;
    margin: 0 auto;
    width: min(calc(100% - 32px), 420px);
    display: grid;
    grid-template-columns: 54px 1fr;
    gap: 12px;
    align-items: center;
    padding: 14px;
    border-radius: 22px;
    border: 1px solid rgba(0,217,255,.35);
    background: rgba(0, 10, 22, .82);
    backdrop-filter: blur(14px);
    box-shadow: 0 18px 50px rgba(0,0,0,.34);
    z-index: 3;
}

.pcg-grace-greeting-card-2392 img {
    width: 54px;
    height: 54px;
    object-fit: cover;
    border-radius: 999px;
    border: 1px solid rgba(0,217,255,.45);
}

.pcg-business-model-2392,
.pcg-start-paths-2392,
.pcg-search-band-2392,
.pcg-platform-card-2392 {
    margin-top: 22px;
}

.pcg-business-model-2392 {
    padding: clamp(22px, 3vw, 34px) !important;
    background:
        radial-gradient(circle at 78% 24%, rgba(0,217,255,.14), transparent 25rem),
        linear-gradient(145deg, rgba(2, 12, 24, .96), rgba(1, 6, 14, .98)) !important;
}

.pcg-business-model-head-2392 {
    max-width: 980px;
    margin-bottom: 18px;
}

.pcg-business-model-head-2392 h2 {
    margin: 10px 0 8px;
    font-size: clamp(28px, 3.4vw, 48px) !important;
}

.pcg-business-model-grid-2392,
.pcg-start-path-grid-2392 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.pcg-start-path-grid-2392 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.pcg-business-card-2392 {
    border: 1px solid rgba(0,217,255,.22);
    border-radius: 20px;
    padding: 18px;
    background: rgba(255,255,255,.035);
    min-height: 210px;
}

.pcg-business-card-highlight-2392 {
    background:
        radial-gradient(circle at 70% 20%, rgba(0,217,255,.16), transparent 16rem),
        rgba(0, 28, 48, .40);
    border-color: rgba(0,217,255,.42);
    box-shadow: 0 18px 52px rgba(0,0,0,.26), 0 0 38px rgba(0,217,255,.10);
}

.pcg-business-note-2392 {
    margin: 16px 0 0;
    font-size: 14px;
    color: #9fb8c8;
}

.pcg-search-band-2392 {
    display: grid;
    grid-template-columns: minmax(240px, .72fr) minmax(300px, 1fr) auto;
    gap: 18px;
    align-items: center;
}

.pcg-search-band-form-2392 {
    margin: 0 !important;
}

.pcg-search-actions-2392 {
    justify-content: flex-end;
}

.pcg-ai-sidepanel-media img {
    object-fit: contain !important;
    object-position: center center !important;
    aspect-ratio: auto !important;
}

@media (min-width: 1180px) {
    .pcg-grace-first-hero-2392 {
        grid-template-columns: minmax(0, 1.08fr) minmax(380px, .72fr);
    }

    .pcg-ai-sidepanel {
        grid-template-columns: minmax(0, 1.18fr) minmax(280px, .62fr) !important;
    }

    .pcg-ai-sidepanel-media img {
        max-height: 560px !important;
    }
}

@media (max-width: 1080px) {
    .pcg-grace-first-hero-2392,
    .pcg-search-band-2392 {
        grid-template-columns: 1fr;
    }

    .pcg-business-model-grid-2392 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pcg-start-path-grid-2392 {
        grid-template-columns: 1fr;
    }

    .pcg-search-actions-2392 {
        justify-content: flex-start;
    }

    .pcg-grace-first-visual-2392 {
        min-height: auto;
    }
}

@media (max-width: 780px) {
    body > header {
        justify-content: center !important;
        flex-wrap: wrap !important;
        min-height: auto !important;
    }

    body > header nav.pcg-public-header-nav,
    body > header .nav.pcg-public-header-nav {
        width: 100% !important;
        justify-content: center !important;
        gap: 8px 14px !important;
    }

    body > header nav.pcg-public-header-nav a,
    body > header .nav.pcg-public-header-nav a {
        font-size: 13px !important;
        min-height: 32px !important;
    }
}

@media (max-width: 620px) {
    .pcg-grace-first-hero-2392 {
        padding: 18px !important;
    }

    .pcg-grace-first-copy-2392 h1 {
        font-size: clamp(34px, 11vw, 48px) !important;
    }

    .pcg-grace-primary-actions-2392,
    .pcg-grace-secondary-actions-2392,
    .pcg-search-actions-2392 {
        display: grid;
        grid-template-columns: 1fr;
    }

    .pcg-grace-primary-actions-2392 .button,
    .pcg-grace-secondary-actions-2392 a {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .pcg-grace-greeting-card-2392 {
        position: static;
        width: 100%;
        margin-top: 12px;
    }

    .pcg-business-model-grid-2392 {
        grid-template-columns: 1fr;
    }
}

/* Role graphics top showcase v0.23.10 */
.pcg-role-graphics-2310 {
    margin-top: 22px !important;
    margin-bottom: 22px !important;
    padding: clamp(16px, 2.2vw, 28px) !important;
    background:
        radial-gradient(circle at 50% 0%, rgba(0,217,255,.12), transparent 28rem),
        linear-gradient(145deg, rgba(2, 12, 24, .96), rgba(1, 6, 14, .98)) !important;
    border-color: rgba(0,217,255,.24) !important;
    overflow: hidden !important;
}

.pcg-role-graphics-head-2310 {
    max-width: 1040px;
    margin: 0 0 18px;
}

.pcg-role-graphics-head-2310 h1 {
    margin: 10px 0 8px !important;
    font-size: clamp(30px, 3.8vw, 58px) !important;
    line-height: 1 !important;
    letter-spacing: -.045em !important;
}

.pcg-role-graphics-head-2310 p {
    max-width: 860px;
    font-size: clamp(16px, 1.3vw, 20px);
}

.pcg-role-graphics-grid-2310 {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(10px, 1.4vw, 18px) !important;
    align-items: start !important;
}

.pcg-role-graphic-card-2310 {
    position: relative !important;
    display: block !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    border: 1px solid rgba(0,217,255,.28) !important;
    background: rgba(0, 10, 22, .76) !important;
    box-shadow: 0 20px 58px rgba(0,0,0,.34), 0 0 34px rgba(0,217,255,.08) !important;
    text-decoration: none !important;
    transform: translateZ(0) !important;
}

.pcg-role-graphic-card-2310:hover {
    border-color: rgba(0,217,255,.58) !important;
    box-shadow: 0 26px 70px rgba(0,0,0,.42), 0 0 48px rgba(0,217,255,.16) !important;
}

.pcg-role-graphic-card-2310 img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: center top !important;
}

.pcg-role-graphic-card-2310 span {
    position: absolute !important;
    left: 14px !important;
    bottom: 14px !important;
    z-index: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    min-height: 34px !important;
    padding: 7px 12px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(0,217,255,.36) !important;
    background: rgba(0, 10, 22, .74) !important;
    color: #eaf8ff !important;
    font-weight: 900 !important;
    letter-spacing: .01em !important;
    backdrop-filter: blur(10px) !important;
}

/* Tablet bleibt bewusst 3er-Reihe */
@media (min-width: 701px) and (max-width: 1080px) {
    .pcg-role-graphics-grid-2310 {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .pcg-role-graphic-card-2310 {
        border-radius: 16px !important;
    }

    .pcg-role-graphic-card-2310 span {
        font-size: 12px !important;
        left: 8px !important;
        bottom: 8px !important;
        min-height: 28px !important;
        padding: 5px 8px !important;
    }
}

/* Handy untereinander */
@media (max-width: 700px) {
    .pcg-role-graphics-2310 {
        padding: 14px !important;
        margin-top: 14px !important;
    }

    .pcg-role-graphics-grid-2310 {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .pcg-role-graphic-card-2310 {
        border-radius: 18px !important;
    }

    .pcg-role-graphic-card-2310 span {
        left: 12px !important;
        bottom: 12px !important;
    }
}

/* Role registration sidepanels v0.23.11 */
.pcg-entry-card-enhanced-2311 {
    overflow: hidden !important;
    padding: clamp(18px, 2.4vw, 32px) !important;
}

.pcg-entry-split-2311 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 420px) !important;
    gap: clamp(18px, 3vw, 34px) !important;
    align-items: start !important;
}

.pcg-entry-content-2311 {
    min-width: 0 !important;
}

.pcg-entry-sidepanel-2311 {
    position: sticky !important;
    top: 96px !important;
    align-self: start !important;
    border-radius: 24px !important;
    border: 1px solid rgba(0,217,255,.30) !important;
    background:
        radial-gradient(circle at 50% 0%, rgba(0,217,255,.14), transparent 20rem),
        rgba(0, 10, 22, .72) !important;
    box-shadow: 0 22px 70px rgba(0,0,0,.36), 0 0 40px rgba(0,217,255,.10) !important;
    overflow: hidden !important;
}

.pcg-entry-sidepanel-copy-2311 {
    padding: 18px 18px 10px !important;
}

.pcg-entry-sidepanel-copy-2311 h2 {
    margin: 10px 0 8px !important;
    font-size: clamp(22px, 2.2vw, 34px) !important;
    line-height: 1.05 !important;
    letter-spacing: -.035em !important;
}

.pcg-entry-sidepanel-copy-2311 p {
    margin: 0 !important;
    color: #cfe7f5 !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
}

.pcg-entry-sidepanel-image-2311 {
    display: block !important;
    padding: 8px !important;
    text-decoration: none !important;
}

.pcg-entry-sidepanel-image-2311 img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: center top !important;
    border-radius: 18px !important;
    border: 1px solid rgba(0,217,255,.20) !important;
    background: rgba(0,0,0,.18) !important;
}

.pcg-entry-sidepanel-image-2311:hover img {
    border-color: rgba(0,217,255,.48) !important;
    box-shadow: 0 0 34px rgba(0,217,255,.14) !important;
}

/* Tablet: weiterhin rechts, aber etwas schmaler */
@media (min-width: 801px) and (max-width: 1120px) {
    .pcg-entry-split-2311 {
        grid-template-columns: minmax(0, 1fr) minmax(260px, 34vw) !important;
        gap: 18px !important;
    }

    .pcg-entry-sidepanel-2311 {
        top: 84px !important;
        border-radius: 18px !important;
    }

    .pcg-entry-sidepanel-copy-2311 {
        padding: 14px 14px 8px !important;
    }

    .pcg-entry-sidepanel-copy-2311 p {
        font-size: 13px !important;
    }
}

/* Handy: untereinander */
@media (max-width: 800px) {
    .pcg-entry-split-2311 {
        grid-template-columns: 1fr !important;
    }

    .pcg-entry-sidepanel-2311 {
        position: static !important;
        order: 2 !important;
        max-width: 560px !important;
        margin: 0 auto !important;
    }

    .pcg-entry-content-2311 {
        order: 1 !important;
    }
}

/* Robust server-buffer entry role sidepanels v0.23.11.2 */
.pcg-entry-buffer-wrap-23112 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 420px) !important;
    gap: clamp(18px, 3vw, 34px) !important;
    align-items: start !important;
}

.pcg-entry-buffer-content-23112 {
    min-width: 0 !important;
}

.pcg-entry-sidepanel-buffer-23112 {
    position: sticky !important;
    top: 96px !important;
    align-self: start !important;
    border-radius: 24px !important;
    border: 1px solid rgba(0,217,255,.30) !important;
    background:
        radial-gradient(circle at 50% 0%, rgba(0,217,255,.14), transparent 20rem),
        rgba(0, 10, 22, .72) !important;
    box-shadow: 0 22px 70px rgba(0,0,0,.36), 0 0 40px rgba(0,217,255,.10) !important;
    overflow: hidden !important;
}

.pcg-entry-sidepanel-copy-buffer-23112 {
    padding: 18px 18px 10px !important;
}

.pcg-entry-sidepanel-copy-buffer-23112 h2 {
    margin: 10px 0 8px !important;
    font-size: clamp(22px, 2.2vw, 34px) !important;
    line-height: 1.05 !important;
    letter-spacing: -.035em !important;
}

.pcg-entry-sidepanel-copy-buffer-23112 p {
    margin: 0 !important;
    color: #cfe7f5 !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
}

.pcg-entry-sidepanel-image-buffer-23112 {
    display: block !important;
    padding: 8px !important;
}

.pcg-entry-sidepanel-image-buffer-23112 img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: center top !important;
    border-radius: 18px !important;
    border: 1px solid rgba(0,217,255,.20) !important;
    background: rgba(0,0,0,.18) !important;
}

/* Tablet: weiterhin rechts */
@media (min-width: 801px) and (max-width: 1120px) {
    .pcg-entry-buffer-wrap-23112 {
        grid-template-columns: minmax(0, 1fr) minmax(260px, 34vw) !important;
        gap: 18px !important;
    }

    .pcg-entry-sidepanel-buffer-23112 {
        top: 84px !important;
        border-radius: 18px !important;
    }

    .pcg-entry-sidepanel-copy-buffer-23112 {
        padding: 14px 14px 8px !important;
    }

    .pcg-entry-sidepanel-copy-buffer-23112 p {
        font-size: 13px !important;
    }
}

/* Handy: untereinander */
@media (max-width: 800px) {
    .pcg-entry-buffer-wrap-23112 {
        grid-template-columns: 1fr !important;
    }

    .pcg-entry-sidepanel-buffer-23112 {
        position: static !important;
        max-width: 560px !important;
        margin: 0 auto !important;
    }
}

/* Player registration email verify module v0.24.0 */
.pcg-registration-card {
    border-color: rgba(0,217,255,.24) !important;
}

.pcg-registration-form {
    margin-top: 18px !important;
}

.pcg-registration-form input[type="email"],
.pcg-registration-form input[type="text"],
.pcg-registration-form input[type="password"] {
    background: rgba(2, 12, 24, .72) !important;
    color: #eaf8ff !important;
    border-color: rgba(0,217,255,.26) !important;
}

.pcg-registration-form input:focus {
    outline: none !important;
    border-color: rgba(0,217,255,.72) !important;
    box-shadow: 0 0 0 3px rgba(0,217,255,.12) !important;
}

.pcg-checkline {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    margin: 14px 0 !important;
    font-weight: 650 !important;
    color: #cfe7f5 !important;
}

.pcg-checkline input {
    width: auto !important;
    margin-top: 4px !important;
}

.pcg-honeypot-field {
    position: absolute !important;
    left: -10000px !important;
    top: auto !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}