
:root{color-scheme:dark;--bg:#070706;--surface:#11110f;--line:rgba(255,255,255,.12);--yellow:#ffe600;--text:#f5f5ef;--muted:#aaa99f;--green:#57e882;--red:#ff6677;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text)}body.menu-open,body.modal-open{overflow:hidden}button,input{font:inherit}a{color:inherit;text-decoration:none}.site-header{position:fixed;z-index:50;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:17px clamp(18px,5vw,68px);border-bottom:1px solid rgba(255,255,255,.08);background:rgba(5,5,4,.84);backdrop-filter:blur(14px)}.brand{display:inline-flex;align-items:center;gap:13px}.brand-logo{display:grid;place-items:center;width:58px;height:52px;border-radius:4px;background:linear-gradient(145deg,var(--yellow),#bda900);color:#070706;font-size:22px;font-weight:1000;letter-spacing:-.08em}.brand-copy{display:flex;flex-direction:column}.brand-copy strong{font-size:21px}.brand-copy small{margin-top:3px;color:var(--muted);font-size:12px}.header-actions{display:flex;align-items:center;gap:8px}.header-link,.menu-button{min-height:46px;padding:11px 16px;border:1px solid transparent;background:transparent;color:var(--text);cursor:pointer}.header-link:hover{color:var(--yellow)}.menu-button{border-color:var(--yellow);background:var(--yellow);color:#070706;font-weight:900;text-transform:uppercase}.menu-button span{margin-right:7px}.hero{position:relative;min-height:100vh;display:flex;align-items:flex-end;padding:150px clamp(24px,8vw,125px) 110px;overflow:hidden;background:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.35)),linear-gradient(to bottom,rgba(0,0,0,.05),rgba(0,0,0,.82)),url('/assets/img/background.jpg') center/cover no-repeat,#171307}.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 55% 45%,rgba(255,230,0,.10),transparent 52%)}.hero-content{position:relative;z-index:2;width:min(840px,100%)}.eyebrow{margin:0 0 15px;color:var(--yellow);font-size:13px;font-weight:900;letter-spacing:.19em;text-transform:uppercase}.hero h1{max-width:820px;margin:0;font-size:clamp(49px,8.3vw,96px);line-height:.96;letter-spacing:-.048em}.hero h1 span{display:block;color:var(--yellow)}.hero-text{max-width:690px;margin:27px 0 0;color:#d0d0c8;font-size:clamp(17px,2vw,22px);line-height:1.72}.hero-actions{display:flex;flex-wrap:wrap;gap:13px;margin-top:34px}.primary-button,.secondary-button,.copy-button{display:inline-flex;justify-content:center;align-items:center;min-height:49px;padding:13px 22px;border:1px solid var(--yellow);cursor:pointer;font-weight:850}.primary-button{background:var(--yellow);color:#080806}.secondary-button,.copy-button{background:transparent;color:var(--yellow)}.page-hero{min-height:430px;display:flex;align-items:end;padding:155px clamp(24px,8vw,125px) 70px;background:linear-gradient(90deg,rgba(0,0,0,.92),rgba(0,0,0,.45)),url('/assets/img/background.jpg') center/cover no-repeat,#151208}.page-hero h1{max-width:900px;margin:0;font-size:clamp(48px,7vw,82px);line-height:1}.page-content{padding:clamp(65px,9vw,110px) clamp(22px,8vw,125px)}.content-intro{width:min(780px,100%);margin-bottom:42px}.content-intro h2{margin:0;font-size:clamp(36px,5.5vw,62px)}.content-intro p,.prose{color:var(--muted);font-size:18px;line-height:1.82}.card-grid,.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,310px),1fr));gap:22px;max-width:1160px}.card,.status-card{padding:clamp(22px,4vw,34px);border:1px solid var(--line);background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.008)),var(--surface)}.card h3,.status-card h3{margin-top:0;font-size:25px}.card p{color:var(--muted);line-height:1.72}.status-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px}.service-icon{display:grid;place-items:center;width:56px;height:56px;background:var(--yellow);color:#070706;font-size:18px;font-weight:1000}.service-icon.ts{background:#66a7ff}.status-head p{margin:5px 0 0;color:var(--muted)}.server-status{padding:6px 10px;border:1px solid var(--line);font-size:12px;font-weight:900}.server-status.online{border-color:rgba(87,232,130,.44);background:rgba(87,232,130,.11);color:var(--green)}.server-status.offline{border-color:rgba(255,102,119,.44);background:rgba(255,102,119,.11);color:var(--red)}.server-status.loading{color:var(--muted)}.server-details{margin:28px 0}.server-details div{display:flex;justify-content:space-between;gap:18px;padding:12px 0;border-bottom:1px solid var(--line)}.server-details dt{color:var(--muted)}.server-details dd{margin:0;text-align:right}.copy-button{width:100%}.last-update{margin-top:24px;color:var(--muted);font-size:13px}.contact-box{max-width:820px;padding:clamp(24px,4vw,38px);border:1px solid var(--line);background:var(--surface)}.contact-box h3{margin-top:0;font-size:28px}.contact-list{display:grid;gap:15px;margin-top:24px}.contact-row{display:flex;justify-content:space-between;gap:25px;padding:14px 0;border-bottom:1px solid var(--line)}.contact-row span:first-child{color:var(--muted)}.site-footer{padding:42px 24px;border-top:1px solid var(--line);background:#030302;text-align:center}.site-footer p{color:var(--muted)}.side-menu{position:fixed;z-index:100;top:0;right:0;width:min(410px,92vw);height:100vh;padding:27px;background:#040403;transform:translateX(100%);transition:transform 220ms ease}.side-menu.open{transform:translateX(0)}.side-menu-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:22px;border-bottom:1px solid var(--line);color:var(--yellow);font-weight:900}.menu-close,.modal-close{border:0;background:transparent;color:var(--text);cursor:pointer;font-size:31px}.side-nav{display:flex;flex-direction:column;margin-top:21px}.side-nav a{padding:17px 8px;border-bottom:1px solid rgba(255,255,255,.075);text-transform:uppercase}.side-nav a:hover,.side-nav a.active{color:var(--yellow)}.page-overlay{position:fixed;z-index:90;inset:0;visibility:hidden;background:rgba(0,0,0,.74);opacity:0;transition:220ms ease}.page-overlay.visible{visibility:visible;opacity:1}.modal{position:fixed;z-index:120;inset:0;display:grid;place-items:center;visibility:hidden;padding:20px;background:rgba(0,0,0,.82);opacity:0;transition:180ms ease}.modal.open{visibility:visible;opacity:1}.modal-dialog{position:relative;width:min(465px,100%);padding:35px;border:1px solid var(--line);background:var(--surface)}.modal-dialog h2{margin-top:0;font-size:36px}.modal-close{position:absolute;top:11px;right:15px}form{display:grid;gap:17px}form label{display:grid;gap:8px;color:var(--muted);font-size:14px}form input{width:100%;padding:13px;border:1px solid var(--line);outline:0;background:#090908;color:var(--text)}form input:focus{border-color:var(--yellow)}.full-width{width:100%}.form-message{min-height:22px;margin:0;color:var(--yellow);font-size:14px}.toast{position:fixed;z-index:200;right:22px;bottom:22px;visibility:hidden;padding:14px 18px;border:1px solid var(--yellow);background:#11110f;color:var(--yellow);opacity:0;transform:translateY(14px);transition:180ms ease}.toast.visible{visibility:visible;opacity:1;transform:translateY(0)}@media(max-width:860px){.header-link{display:none}.site-header{padding:13px 16px}.brand-copy small{display:none}.hero{padding-inline:24px}}@media(max-width:560px){.brand-logo{width:48px;height:44px;font-size:19px}.brand-copy strong{font-size:16px}.menu-button{padding:10px 12px}.hero h1{font-size:45px}.status-head{grid-template-columns:auto 1fr}.server-status{grid-column:1/-1;width:max-content}.page-content{padding-inline:20px}.contact-row{flex-direction:column;gap:5px}}


/* ===== Oldalsó menü: lenyitható Egyebek rész ===== */
.menu-group {
    border-bottom: 1px solid rgba(255, 255, 255, 0.075);
}

.submenu-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;

    width: 100%;
    padding: 17px 8px;

    border: 0;
    background: transparent;
    color: var(--text);

    cursor: pointer;
    text-align: left;
    text-transform: uppercase;
}

.submenu-toggle:hover,
.submenu-toggle.active {
    color: var(--yellow);
}

.submenu-arrow {
    color: var(--yellow);
    font-size: 18px;
    transition: transform 180ms ease;
}

.submenu-toggle[aria-expanded="true"] .submenu-arrow {
    transform: rotate(180deg);
}

.submenu {
    display: grid;
    grid-template-rows: 0fr;

    background: rgba(255, 255, 255, 0.025);
    transition: grid-template-rows 200ms ease;
}

.submenu.open {
    grid-template-rows: 1fr;
}

.submenu-inner {
    overflow: hidden;
}

.submenu a {
    display: block;
    padding: 14px 12px 14px 27px;

    border-top: 1px solid rgba(255, 255, 255, 0.055);

    color: #c9c9c1;
    font-size: 14px;
    text-transform: none;
}

.submenu a:hover,
.submenu a.active {
    color: var(--yellow);
    background: rgba(255, 230, 0, 0.045);
}

.voucher-form {
    display: grid;
    gap: 18px;

    max-width: 650px;
    padding: clamp(24px, 4vw, 38px);

    border: 1px solid var(--line);
    background: var(--surface);
}

.voucher-form p {
    margin-top: 0;
    color: var(--muted);
    line-height: 1.75;
}

.voucher-form input {
    width: 100%;
    padding: 14px;

    border: 1px solid var(--line);
    outline: 0;
    background: #090908;
    color: var(--text);
}

.voucher-form input:focus {
    border-color: var(--yellow);
}

.notice {
    max-width: 850px;
    padding: 18px 20px;

    border-left: 4px solid var(--yellow);
    background: rgba(255, 230, 0, 0.065);
    color: #d7d7cf;
    line-height: 1.7;
}


/* ===== Kapcsolat oldal ===== */
.contact-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(340px, 1.1fr);
    gap: 24px;
    align-items: start;
    max-width: 1180px;
}

.contact-panel,
.company-panel {
    padding: clamp(24px, 4vw, 38px);
    border: 1px solid var(--line);
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.045),
            rgba(255, 255, 255, 0.008)
        ),
        var(--surface);
}

.contact-panel h3,
.company-panel h3 {
    margin: 0 0 10px;
    font-size: clamp(27px, 4vw, 36px);
}

.contact-panel > p,
.company-panel > p {
    margin: 0;
    color: var(--muted);
    line-height: 1.75;
}

.contact-methods {
    display: grid;
    gap: 14px;
    margin-top: 28px;
}

.contact-method {
    display: grid;
    grid-template-columns: 50px 1fr;
    gap: 15px;
    align-items: center;
    padding: 17px;
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.018);
}

.contact-method-icon {
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    background: var(--yellow);
    color: #080806;
    font-size: 15px;
    font-weight: 1000;
}

.contact-method:nth-child(2) .contact-method-icon {
    background: #5865f2;
    color: #fff;
}

.contact-method:nth-child(3) .contact-method-icon {
    background: #e6e6df;
    color: #090908;
}

.contact-method strong {
    display: block;
    margin-bottom: 4px;
}

.contact-method span {
    color: var(--muted);
    font-size: 14px;
}

.contact-form {
    display: grid;
    gap: 18px;
    margin-top: 27px;
}

.contact-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.contact-form label {
    display: grid;
    gap: 8px;
    color: var(--muted);
    font-size: 14px;
}

.contact-form textarea {
    min-height: 155px;
    resize: vertical;
}

.contact-form button[disabled] {
    cursor: not-allowed;
    opacity: 0.64;
}

.company-section {
    padding-top: 28px;
}

.company-panel {
    max-width: 1180px;
}

.company-heading {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: flex-start;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--line);
}

.company-badge {
    flex: 0 0 auto;
    padding: 8px 12px;
    border: 1px solid rgba(255, 230, 0, 0.38);
    background: rgba(255, 230, 0, 0.08);
    color: var(--yellow);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.company-details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 32px;
    margin: 24px 0 0;
}

.company-details div {
    display: grid;
    grid-template-columns: minmax(135px, 0.75fr) 1.25fr;
    gap: 18px;
    padding: 16px 0;
    border-bottom: 1px solid var(--line);
}

.company-details dt {
    color: var(--muted);
}

.company-details dd {
    margin: 0;
    text-align: right;
    font-weight: 700;
}

.company-note {
    margin-top: 22px !important;
    padding: 16px 18px;
    border-left: 4px solid var(--yellow);
    background: rgba(255, 230, 0, 0.055);
    color: #d3d3cb !important;
}

@media (max-width: 900px) {
    .contact-layout {
        grid-template-columns: 1fr;
    }

    .company-details {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .contact-form-grid {
        grid-template-columns: 1fr;
    }

    .company-heading {
        flex-direction: column;
    }

    .company-details div {
        grid-template-columns: 1fr;
        gap: 5px;
    }

    .company-details dd {
        text-align: left;
    }
}

/* ===== Szervereink oldal ===== */
.servers-showcase {
    position: relative;
    overflow: hidden;
}

.servers-showcase::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 15% 20%, rgba(255, 230, 0, 0.07), transparent 35%),
        radial-gradient(circle at 85% 75%, rgba(87, 133, 255, 0.07), transparent 35%);
}

.servers-intro {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.55fr);
    gap: clamp(28px, 7vw, 90px);
    align-items: end;
    max-width: 1180px;
    margin-bottom: 48px;
}

.servers-intro h2 {
    margin: 0;
    font-size: clamp(39px, 6vw, 68px);
    line-height: 1.02;
}

.servers-intro p {
    margin: 0;
    color: var(--muted);
    font-size: 18px;
    line-height: 1.8;
}

.server-mode-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    max-width: 1180px;
}

.mode-card {
    --mode-accent: var(--yellow);
    position: relative;
    min-height: 370px;
    padding: 30px;
    overflow: hidden;
    border: 1px solid var(--line);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.008)),
        var(--surface);
    transition:
        transform 200ms ease,
        border-color 200ms ease,
        box-shadow 200ms ease;
}

.mode-card:hover {
    transform: translateY(-5px);
    border-color: var(--mode-accent);
    box-shadow: 0 28px 60px rgba(0, 0, 0, 0.28);
}

.mode-card::before {
    content: "";
    position: absolute;
    top: -90px;
    right: -80px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: var(--mode-accent);
    opacity: 0.1;
    filter: blur(3px);
}

.mode-card::after {
    content: attr(data-code);
    position: absolute;
    right: -8px;
    bottom: -32px;
    color: rgba(255, 255, 255, 0.035);
    font-size: clamp(100px, 15vw, 190px);
    font-weight: 1000;
    line-height: 1;
    letter-spacing: -0.08em;
    pointer-events: none;
}

.mode-prison { --mode-accent: #ffcf4d; }
.mode-smp { --mode-accent: #62df8b; }
.mode-skyboss { --mode-accent: #8aa7ff; }
.mode-opskyblock { --mode-accent: #d67cff; }

.mode-card-top,
.mode-card-content,
.mode-card-footer {
    position: relative;
    z-index: 2;
}

.mode-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.mode-number {
    color: var(--mode-accent);
    font-size: 13px;
    font-weight: 950;
    letter-spacing: 0.16em;
}

.mode-badge {
    padding: 7px 10px;
    border: 1px solid var(--mode-accent);
    background: rgba(255, 255, 255, 0.025);
    color: var(--mode-accent);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.mode-card-content {
    margin-top: 58px;
    max-width: 480px;
}

.mode-card h3 {
    margin: 0;
    font-size: clamp(36px, 5vw, 54px);
    line-height: 0.98;
    letter-spacing: -0.04em;
}

.mode-card h3 span {
    color: var(--mode-accent);
}

.mode-card p {
    margin: 20px 0 0;
    color: #c3c3bb;
    font-size: 17px;
    line-height: 1.75;
}

.mode-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 24px;
}

.mode-tags span {
    padding: 7px 10px;
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.025);
    color: #d6d6cf;
    font-size: 12px;
}

.mode-card-footer {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin-top: 38px;
    padding-top: 20px;
    border-top: 1px solid var(--line);
}

.mode-card-footer small {
    color: var(--muted);
}

.mode-link {
    color: var(--mode-accent);
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
}

.server-roadmap {
    position: relative;
    z-index: 1;
    max-width: 1180px;
    margin-top: 24px;
    padding: 22px 24px;
    border: 1px solid var(--line);
    border-left: 4px solid var(--yellow);
    background: rgba(255, 230, 0, 0.045);
}

.server-roadmap strong {
    display: block;
    margin-bottom: 6px;
    color: var(--yellow);
}

.server-roadmap p {
    margin: 0;
    color: #c7c7bf;
    line-height: 1.7;
}

@media (max-width: 920px) {
    .servers-intro {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .server-mode-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .mode-card {
        min-height: 345px;
        padding: 24px;
    }

    .mode-card-content {
        margin-top: 45px;
    }

    .mode-card-footer {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* ===== WebShop oldal ===== */
.shop-page { position: relative; overflow: hidden; }
.shop-page::before {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background:
        radial-gradient(circle at 12% 18%, rgba(255,230,0,.07), transparent 30%),
        radial-gradient(circle at 88% 28%, rgba(116,83,255,.08), transparent 32%),
        radial-gradient(circle at 55% 88%, rgba(41,209,132,.06), transparent 32%);
}
.shop-intro, .shop-section { position: relative; z-index: 1; max-width: 1180px; }
.shop-intro {
    display: grid; grid-template-columns: minmax(0,1fr) minmax(280px,.55fr);
    gap: clamp(28px,7vw,90px); align-items: end; margin-bottom: 34px;
}
.shop-intro h2 { margin: 0; font-size: clamp(39px,6vw,68px); line-height: 1.02; }
.shop-intro p { margin: 0; color: var(--muted); font-size: 18px; line-height: 1.8; }
.shop-alert {
    position: relative; z-index: 1; max-width: 1180px; margin-bottom: 38px;
    padding: 18px 20px; border: 1px solid rgba(255,230,0,.26);
    border-left: 4px solid var(--yellow); background: rgba(255,230,0,.055);
    color: #d5d5cd; line-height: 1.7;
}
.shop-section { margin-top: 54px; }
.shop-section-heading {
    display: flex; justify-content: space-between; align-items: end;
    gap: 25px; margin-bottom: 22px;
}
.shop-section-heading h3 { margin: 0; font-size: clamp(30px,5vw,48px); }
.shop-section-heading p { max-width: 520px; margin: 0; color: var(--muted); line-height: 1.7; text-align: right; }
.rank-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; }
.rank-card {
    --rank-accent: var(--yellow); position: relative; min-height: 420px;
    padding: 26px; overflow: hidden; border: 1px solid var(--line);
    background: linear-gradient(150deg,rgba(255,255,255,.05),rgba(255,255,255,.008)), var(--surface);
    transition: transform 200ms ease, border-color 200ms ease, box-shadow 200ms ease;
}
.rank-card:hover { transform: translateY(-5px); border-color: var(--rank-accent); box-shadow: 0 28px 60px rgba(0,0,0,.28); }
.rank-card::before {
    content: ""; position: absolute; width: 250px; height: 250px;
    top: -115px; right: -110px; border-radius: 50%; background: var(--rank-accent); opacity: .13;
}
.rank-card::after {
    content: attr(data-symbol); position: absolute; right: -7px; bottom: -31px;
    color: rgba(255,255,255,.035); font-size: 155px; font-weight: 1000; line-height: 1; pointer-events: none;
}
.rank-dragon { --rank-accent: #ff8c42; }
.rank-diamond { --rank-accent: #55d8ff; }
.rank-atom { --rank-accent: #ffe600; }
.rank-prince { --rank-accent: #c78cff; }
.rank-card.limited {
    border-color: rgba(199,140,255,.42);
    background: linear-gradient(155deg,rgba(199,140,255,.10),rgba(255,255,255,.008)), var(--surface);
}
.rank-top, .rank-body, .rank-footer { position: relative; z-index: 2; }
.rank-top { display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.rank-type { color: var(--rank-accent); font-size: 12px; font-weight: 950; letter-spacing: .13em; text-transform: uppercase; }
.rank-limited { padding: 6px 9px; border: 1px solid var(--rank-accent); color: var(--rank-accent); font-size: 10px; font-weight: 950; text-transform: uppercase; }
.rank-body { margin-top: 56px; }
.rank-card h4 { margin: 0; font-size: clamp(34px,4vw,48px); line-height: 1; color: var(--rank-accent); }
.rank-card .rank-body p { min-height: 82px; margin: 18px 0 0; color: #c5c5bd; line-height: 1.68; }
.rank-benefits { display: grid; gap: 9px; margin: 23px 0 0; padding: 0; list-style: none; }
.rank-benefits li { position: relative; padding-left: 17px; color: #d7d7cf; font-size: 14px; }
.rank-benefits li::before { content: "•"; position: absolute; left: 0; color: var(--rank-accent); font-weight: 1000; }
.rank-footer { display: grid; gap: 12px; margin-top: 29px; padding-top: 20px; border-top: 1px solid var(--line); }
.rank-price { display: flex; justify-content: space-between; gap: 12px; color: var(--muted); }
.rank-price strong { color: var(--rank-accent); }
.shop-button {
    width: 100%; min-height: 46px; border: 1px solid var(--rank-accent,var(--yellow));
    background: transparent; color: var(--rank-accent,var(--yellow)); cursor: not-allowed; font-weight: 900; opacity: .72;
}
.product-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.product-card {
    --product-accent: var(--yellow); position: relative; min-height: 250px;
    padding: 25px; overflow: hidden; border: 1px solid var(--line);
    background: linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.008)), var(--surface);
}
.product-card::before {
    content: ""; position: absolute; width: 160px; height: 160px; right: -70px; top: -70px;
    border-radius: 50%; background: var(--product-accent); opacity: .10;
}
.product-coins { --product-accent: #ffd43b; }
.product-keys { --product-accent: #66c7ff; }
.product-lootbox { --product-accent: #da82ff; }
.product-blessing { --product-accent: #ff9270; }
.product-autominer { --product-accent: #63df94; }
.product-permission { --product-accent: #91a3ff; }
.product-icon, .product-card h4, .product-card p, .product-card footer { position: relative; z-index: 2; }
.product-icon {
    display: grid; place-items: center; width: 52px; height: 52px;
    border: 1px solid var(--product-accent); background: rgba(255,255,255,.025);
    color: var(--product-accent); font-size: 18px; font-weight: 1000;
}
.product-card h4 { margin: 22px 0 0; font-size: 26px; }
.product-card p { margin: 12px 0 0; color: var(--muted); line-height: 1.68; }
.product-card footer { margin-top: 23px; padding-top: 17px; border-top: 1px solid var(--line); color: var(--product-accent); font-size: 12px; font-weight: 900; text-transform: uppercase; }
.shop-footer-note { position: relative; z-index: 1; max-width: 1180px; margin-top: 42px; padding: 23px 25px; border: 1px solid var(--line); background: var(--surface); }
.shop-footer-note strong { display: block; margin-bottom: 8px; color: var(--yellow); }
.shop-footer-note p { margin: 0; color: var(--muted); line-height: 1.72; }
@media (max-width:1080px) { .rank-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width:900px) {
    .shop-intro { grid-template-columns: 1fr; align-items: start; }
    .shop-section-heading { align-items: start; flex-direction: column; }
    .shop-section-heading p { text-align: left; }
    .product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:620px) {
    .rank-grid, .product-grid { grid-template-columns: 1fr; }
    .rank-card { min-height: 390px; }
}


/* ===== WebShop V6 új termékkategóriák ===== */
.product-booster { --product-accent: #ffb24d; }
.product-seasonal { --product-accent: #ff6f91; }
.product-chatpack { --product-accent: #71d9ff; }
.product-chatprefix { --product-accent: #74e6a5; }
.product-tabprefix { --product-accent: #c391ff; }

.product-chatprefix,
.product-tabprefix {
    border-color: rgba(255, 255, 255, 0.18);
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.055),
            rgba(255, 255, 255, 0.008)
        ),
        var(--surface);
}


/* ===== Telefon alkalmazás oldal ===== */
.app-page { position: relative; overflow: hidden; }
.app-page::before {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background:
        radial-gradient(circle at 16% 18%, rgba(116,230,165,.09), transparent 30%),
        radial-gradient(circle at 84% 26%, rgba(113,217,255,.08), transparent 32%),
        radial-gradient(circle at 55% 88%, rgba(199,145,255,.07), transparent 34%);
}
.app-hero-grid, .app-section, .app-download-panel { position: relative; z-index: 1; max-width: 1180px; }
.app-hero-grid {
    display: grid; grid-template-columns: minmax(0,1fr) minmax(310px,.72fr);
    gap: clamp(36px,8vw,110px); align-items: center;
}
.app-copy h2 {
    margin: 0; max-width: 720px; font-size: clamp(42px,6.5vw,76px);
    line-height: .98; letter-spacing: -.045em;
}
.app-copy h2 span { color: #74e6a5; }
.app-copy > p { max-width: 690px; margin: 27px 0 0; color: var(--muted); font-size: 18px; line-height: 1.82; }
.app-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.app-meta span { padding: 8px 11px; border: 1px solid var(--line); background: rgba(255,255,255,.025); color: #d8d8d1; font-size: 12px; }
.app-actions { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 30px; }
.android-button {
    display: inline-flex; align-items: center; justify-content: center; gap: 11px;
    min-height: 54px; padding: 14px 22px; border: 1px solid #74e6a5;
    background: #74e6a5; color: #07100a; font-weight: 950;
}
.android-button.disabled { cursor: not-allowed; opacity: .62; }
.android-button-icon { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: rgba(0,0,0,.12); font-size: 13px; font-weight: 1000; }
.app-secondary-link {
    display: inline-flex; align-items: center; justify-content: center; min-height: 54px;
    padding: 14px 20px; border: 1px solid var(--line); color: #d8d8d1; font-weight: 850;
}
.app-secondary-link:hover { border-color: #74e6a5; color: #74e6a5; }
.phone-stage { position: relative; display: grid; place-items: center; min-height: 610px; }
.phone-stage::before, .phone-stage::after { content: ""; position: absolute; border-radius: 50%; filter: blur(2px); }
.phone-stage::before { width: 350px; height: 350px; background: rgba(116,230,165,.10); }
.phone-stage::after { width: 220px; height: 220px; right: 2%; bottom: 5%; background: rgba(113,217,255,.08); }
.phone-mockup {
    position: relative; z-index: 2; width: min(310px,82vw); padding: 13px;
    border: 1px solid rgba(255,255,255,.24); border-radius: 38px; background: #050505;
    box-shadow: 0 40px 90px rgba(0,0,0,.48), 0 0 0 7px rgba(255,255,255,.025);
    transform: rotate(3deg);
}
.phone-notch { width: 100px; height: 23px; margin: 0 auto -12px; border-radius: 0 0 15px 15px; background: #020202; }
.phone-screen {
    min-height: 560px; padding: 32px 20px 20px; overflow: hidden; border-radius: 28px;
    background: radial-gradient(circle at 50% 0%, rgba(255,230,0,.16), transparent 35%), linear-gradient(180deg,#15150f 0%,#080807 68%);
}
.phone-app-head { display: flex; justify-content: space-between; align-items: center; }
.phone-app-logo { display: grid; place-items: center; width: 44px; height: 40px; border-radius: 5px; background: var(--yellow); color: #080806; font-size: 15px; font-weight: 1000; }
.phone-app-status { display: inline-flex; align-items: center; gap: 7px; color: #74e6a5; font-size: 11px; font-weight: 900; }
.phone-app-status::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #74e6a5; box-shadow: 0 0 15px rgba(116,230,165,.75); }
.phone-welcome { margin-top: 36px; }
.phone-welcome small { color: var(--yellow); font-weight: 900; letter-spacing: .12em; }
.phone-welcome h3 { margin: 9px 0 0; font-size: 31px; line-height: 1.03; }
.phone-mini-card { margin-top: 25px; padding: 18px; border: 1px solid var(--line); background: rgba(255,255,255,.035); }
.phone-mini-card-head { display: flex; justify-content: space-between; gap: 15px; color: #dcdcd5; }
.phone-mini-card-head strong { color: #74e6a5; font-size: 12px; }
.phone-mini-stats { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; margin-top: 16px; }
.phone-mini-stat { padding: 13px; background: rgba(0,0,0,.26); }
.phone-mini-stat span { display: block; color: var(--muted); font-size: 10px; }
.phone-mini-stat strong { display: block; margin-top: 6px; font-size: 16px; }
.phone-menu-preview { display: grid; gap: 10px; margin-top: 20px; }
.phone-menu-item { display: flex; justify-content: space-between; gap: 12px; padding: 13px 14px; border: 1px solid rgba(255,255,255,.08); color: #d7d7d0; font-size: 12px; }
.phone-menu-item span:last-child { color: var(--yellow); }
.app-section { margin-top: 90px; }
.app-section-heading { display: grid; grid-template-columns: minmax(0,1fr) minmax(280px,.7fr); gap: clamp(28px,7vw,80px); align-items: end; margin-bottom: 25px; }
.app-section-heading h3 { margin: 0; font-size: clamp(34px,5vw,56px); }
.app-section-heading p { margin: 0; color: var(--muted); line-height: 1.75; }
.app-feature-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.app-feature-card {
    --app-accent: #74e6a5; position: relative; min-height: 235px; padding: 25px; overflow: hidden;
    border: 1px solid var(--line); background: linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.008)), var(--surface);
}
.app-feature-card::before { content: ""; position: absolute; top: -80px; right: -75px; width: 170px; height: 170px; border-radius: 50%; background: var(--app-accent); opacity: .10; }
.app-feature-card:nth-child(2) { --app-accent: #71d9ff; }
.app-feature-card:nth-child(3) { --app-accent: #c791ff; }
.app-feature-card:nth-child(4) { --app-accent: #ffd34f; }
.app-feature-card:nth-child(5) { --app-accent: #ff8d73; }
.app-feature-card:nth-child(6) { --app-accent: #8ea6ff; }
.app-feature-icon, .app-feature-card h4, .app-feature-card p { position: relative; z-index: 2; }
.app-feature-icon { display: grid; place-items: center; width: 52px; height: 52px; border: 1px solid var(--app-accent); color: var(--app-accent); font-weight: 1000; }
.app-feature-card h4 { margin: 21px 0 0; font-size: 24px; }
.app-feature-card p { margin: 12px 0 0; color: var(--muted); line-height: 1.68; }
.app-download-panel {
    display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 30px; align-items: center;
    margin-top: 80px; padding: clamp(26px,5vw,46px); border: 1px solid rgba(116,230,165,.28);
    background: linear-gradient(135deg,rgba(116,230,165,.09),rgba(255,255,255,.008)), var(--surface);
}
.app-download-panel h3 { margin: 0; font-size: clamp(30px,5vw,48px); }
.app-download-panel p { max-width: 720px; margin: 14px 0 0; color: var(--muted); line-height: 1.74; }
.app-download-status { display: grid; gap: 9px; min-width: 210px; padding: 18px; border: 1px solid var(--line); background: rgba(0,0,0,.18); }
.app-download-status span { color: var(--muted); font-size: 12px; }
.app-download-status strong { color: #74e6a5; }
.app-install-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; margin-top: 25px; }
.app-install-step { padding: 23px; border: 1px solid var(--line); background: var(--surface); }
.app-install-number { color: var(--yellow); font-size: 13px; font-weight: 1000; letter-spacing: .13em; }
.app-install-step h4 { margin: 17px 0 0; font-size: 22px; }
.app-install-step p { margin: 11px 0 0; color: var(--muted); line-height: 1.66; }
.app-warning { margin-top: 24px; padding: 18px 20px; border-left: 4px solid var(--yellow); background: rgba(255,230,0,.055); color: #d5d5ce; line-height: 1.72; }
@media (max-width:1000px) {
    .app-hero-grid { grid-template-columns: 1fr; }
    .phone-stage { min-height: 590px; }
    .app-feature-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .app-download-panel { grid-template-columns: 1fr; }
}
@media (max-width:760px) {
    .app-section-heading { grid-template-columns: 1fr; align-items: start; }
    .app-install-grid { grid-template-columns: 1fr; }
}
@media (max-width:590px) {
    .app-feature-grid { grid-template-columns: 1fr; }
    .app-actions { flex-direction: column; }
    .android-button, .app-secondary-link { width: 100%; }
}


/* ===== V8: valódi webes fiókrendszer és profil ===== */
.is-hidden {
    display: none !important;
}

.auth-user-controls {
    display: flex;
    align-items: center;
    gap: 8px;
}

.auth-user-name {
    max-width: 170px;
    overflow: hidden;
    color: var(--yellow);
    font-size: 13px;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-link {
    min-height: 42px;
    padding: 10px 13px;
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.025);
    color: var(--text);
    cursor: pointer;
    font-size: 13px;
    font-weight: 800;
}

.account-link:hover {
    border-color: var(--yellow);
    color: var(--yellow);
}

.auth-logout-button:disabled,
.primary-button:disabled {
    cursor: wait;
    opacity: 0.65;
}

.form-message[data-type="success"] {
    color: var(--green);
}

.form-message[data-type="error"] {
    color: var(--red);
}

.primary-button.is-loading {
    cursor: wait;
    opacity: 0.75;
}

.toast[data-type="success"] {
    border-color: var(--green);
    color: var(--green);
}

.toast[data-type="error"] {
    border-color: var(--red);
    color: var(--red);
}

.profile-page {
    position: relative;
    overflow: hidden;
}

.profile-page::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(
            circle at 15% 12%,
            rgba(255, 230, 0, 0.07),
            transparent 32%
        ),
        radial-gradient(
            circle at 88% 75%,
            rgba(113, 217, 255, 0.06),
            transparent 34%
        );
}

.profile-shell {
    position: relative;
    z-index: 1;
    max-width: 1180px;
}

.profile-loading,
.profile-guest {
    max-width: 760px;
    padding: clamp(26px, 5vw, 46px);
    border: 1px solid var(--line);
    background: var(--surface);
}

.profile-loading p,
.profile-guest p {
    color: var(--muted);
    font-size: 17px;
    line-height: 1.75;
}

.profile-account-header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 22px;
    align-items: center;
    padding: clamp(25px, 4vw, 38px);
    border: 1px solid var(--line);
    background:
        linear-gradient(
            145deg,
            rgba(255, 230, 0, 0.07),
            rgba(255, 255, 255, 0.008)
        ),
        var(--surface);
}

.profile-avatar {
    display: grid;
    place-items: center;
    width: 82px;
    height: 82px;
    border: 1px solid var(--yellow);
    background: var(--yellow);
    color: #080806;
    font-size: 27px;
    font-weight: 1000;
    letter-spacing: -0.06em;
}

.profile-heading h2 {
    margin: 0;
    font-size: clamp(32px, 5vw, 52px);
}

.profile-heading p {
    margin: 9px 0 0;
    color: var(--muted);
}

.profile-status {
    padding: 8px 12px;
    border: 1px solid rgba(87, 232, 130, 0.4);
    background: rgba(87, 232, 130, 0.10);
    color: var(--green);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.profile-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.85fr);
    gap: 22px;
    margin-top: 22px;
}

.profile-panel {
    padding: clamp(24px, 4vw, 36px);
    border: 1px solid var(--line);
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.04),
            rgba(255, 255, 255, 0.008)
        ),
        var(--surface);
}

.profile-panel h3 {
    margin: 0;
    font-size: 27px;
}

.profile-panel > p {
    margin: 10px 0 0;
    color: var(--muted);
    line-height: 1.7;
}

.profile-details {
    margin: 26px 0 0;
}

.profile-details div {
    display: grid;
    grid-template-columns: minmax(145px, 0.8fr) 1.2fr;
    gap: 18px;
    padding: 15px 0;
    border-bottom: 1px solid var(--line);
}

.profile-details dt {
    color: var(--muted);
}

.profile-details dd {
    margin: 0;
    overflow-wrap: anywhere;
    text-align: right;
    font-weight: 750;
}

.minecraft-link-state {
    display: grid;
    gap: 18px;
    margin-top: 25px;
    padding: 22px;
    border: 1px solid rgba(255, 230, 0, 0.26);
    background: rgba(255, 230, 0, 0.045);
}

.minecraft-link-state strong {
    color: var(--yellow);
    font-size: 19px;
}

.minecraft-link-state p {
    margin: 0;
    color: #c8c8c0;
    line-height: 1.7;
}

.minecraft-link-state button {
    width: 100%;
    opacity: 0.62;
    cursor: not-allowed;
}

.profile-next-steps {
    display: grid;
    gap: 11px;
    margin: 24px 0 0;
    padding: 0;
    list-style: none;
}

.profile-next-steps li {
    position: relative;
    padding-left: 20px;
    color: #d1d1ca;
    line-height: 1.55;
}

.profile-next-steps li::before {
    content: "→";
    position: absolute;
    left: 0;
    color: var(--yellow);
}

.profile-logout {
    margin-top: 24px;
    width: 100%;
}

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

@media (max-width: 860px) {
    .auth-user-name {
        display: none;
    }

    .account-link {
        padding-inline: 10px;
    }
}

@media (max-width: 650px) {
    .auth-logout-button {
        display: none;
    }

    .profile-account-header {
        grid-template-columns: auto 1fr;
    }

    .profile-status {
        grid-column: 1 / -1;
        width: max-content;
    }

    .profile-details div {
        grid-template-columns: 1fr;
        gap: 5px;
    }

    .profile-details dd {
        text-align: left;
    }
}

@media (max-width: 470px) {
    .auth-profile-link {
        display: none;
    }
}


/* ===== V9: Minecraft összekapcsoló felület ===== */

.minecraft-link-state button {
    cursor: pointer;
    opacity: 1;
}

.minecraft-link-state button:disabled {
    cursor: wait;
    opacity: 0.66;
}

.minecraft-link-code-panel {
    display: grid;
    gap: 20px;
    margin-top: 25px;
    padding: 23px;
    border: 1px solid rgba(255, 230, 0, 0.32);
    background:
        linear-gradient(
            145deg,
            rgba(255, 230, 0, 0.08),
            rgba(255, 255, 255, 0.012)
        );
}

.minecraft-link-code-head {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: flex-start;
}

.minecraft-link-code-head span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.minecraft-link-code-head strong {
    display: block;
    margin-top: 8px;
    color: var(--yellow);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: clamp(38px, 7vw, 64px);
    letter-spacing: 0.11em;
    line-height: 1;
}

.minecraft-link-countdown {
    flex: 0 0 auto;
    padding: 8px 11px;
    border: 1px solid rgba(255, 230, 0, 0.38);
    background: rgba(255, 230, 0, 0.07);
    color: var(--yellow) !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 14px !important;
}

.minecraft-link-code-panel > p {
    margin: 0;
    color: #c8c8c0;
    line-height: 1.7;
}

.minecraft-link-command {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    border: 1px solid var(--line);
    background: #080807;
}

.minecraft-link-command code {
    overflow-x: auto;
    padding: 16px;
    color: #f2f2eb;
    font-size: 15px;
    white-space: nowrap;
}

.minecraft-link-command button {
    min-width: 105px;
    border: 0;
    border-left: 1px solid var(--line);
    background: var(--yellow);
    color: #080806;
    cursor: pointer;
    font-weight: 950;
}

.minecraft-link-code-actions {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 18px;
    align-items: center;
}

.minecraft-link-code-actions span {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.5;
}

.minecraft-linked-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 18px;
    align-items: center;
    margin-top: 25px;
    padding: 23px;
    border: 1px solid rgba(87, 232, 130, 0.34);
    background:
        linear-gradient(
            145deg,
            rgba(87, 232, 130, 0.10),
            rgba(255, 255, 255, 0.01)
        );
}

.minecraft-linked-icon {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border: 1px solid var(--green);
    background: var(--green);
    color: #061009;
    font-weight: 1000;
}

.minecraft-linked-card span,
.minecraft-linked-card small {
    display: block;
}

.minecraft-linked-card span {
    color: var(--green);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.minecraft-linked-card strong {
    display: block;
    margin-top: 5px;
    font-size: 24px;
}

.minecraft-linked-card small {
    margin-top: 6px;
    overflow-wrap: anywhere;
    color: var(--muted);
}

.minecraft-link-message {
    min-height: 22px;
    margin: 16px 0 0;
    line-height: 1.55;
}

.minecraft-link-message[data-type="success"] {
    color: var(--green);
}

.minecraft-link-message[data-type="error"] {
    color: var(--red);
}

@media (max-width: 590px) {
    .minecraft-link-code-head {
        flex-direction: column;
    }

    .minecraft-link-code-head strong {
        letter-spacing: 0.06em;
    }

    .minecraft-link-command {
        grid-template-columns: 1fr;
    }

    .minecraft-link-command button {
        min-height: 45px;
        border-left: 0;
        border-top: 1px solid var(--line);
    }

    .minecraft-link-code-actions {
        grid-template-columns: 1fr;
    }
}


/* ===== V10: kibővített saját profil ===== */
.profile-main-panel {
    display: grid;
    gap: 22px;
}

.profile-cards-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.profile-card {
    padding: 24px;
    border: 1px solid var(--line);
    background: linear-gradient(145deg, rgba(255,255,255,0.04), rgba(255,255,255,0.01));
}

.profile-card-head {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px;
    align-items: center;
    margin-bottom: 16px;
}

.profile-card-head h4 {
    margin: 0;
    font-size: 22px;
}

.profile-card-head small {
    display: block;
    margin-top: 5px;
    color: var(--muted);
    line-height: 1.4;
}

.profile-card-icon {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    border: 1px solid rgba(255, 230, 0, 0.35);
    background: rgba(255, 230, 0, 0.09);
    font-size: 23px;
}

.profile-details.compact {
    margin-top: 0;
}

.profile-details.compact div:last-child {
    border-bottom: 0;
}

.status-card {
    margin-top: 0;
}

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

.penalty-item {
    display: grid;
    gap: 10px;
    padding: 18px;
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.02);
}

.penalty-label {
    color: var(--muted);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: max-content;
    min-width: 80px;
    padding: 8px 12px;
    border: 1px solid var(--line);
    font-size: 12px;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.status-yes {
    border-color: rgba(255, 88, 88, 0.45);
    background: rgba(255, 88, 88, 0.11);
    color: #ff6464;
}

.status-no {
    border-color: rgba(87, 232, 130, 0.45);
    background: rgba(87, 232, 130, 0.11);
    color: var(--green);
}

.status-neutral {
    border-color: rgba(255, 230, 0, 0.3);
    background: rgba(255, 230, 0, 0.08);
    color: var(--yellow);
}

.penalty-item small {
    color: #d1d1ca;
    line-height: 1.5;
}

.danger-zone {
    border-color: rgba(255, 88, 88, 0.35);
    background: linear-gradient(145deg, rgba(255, 88, 88, 0.10), rgba(255,255,255,0.01));
}

.danger-copy {
    display: grid;
    gap: 14px;
    color: #e6e6df;
    line-height: 1.7;
}

.danger-copy p {
    margin: 0;
}

.danger-warning {
    color: #ff6969;
    font-weight: 900;
}

.danger-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 16px;
}

.danger-button {
    min-height: 46px;
    padding: 12px 16px;
    border: 1px solid rgba(255, 88, 88, 0.5);
    background: rgba(255, 88, 88, 0.15);
    color: #ff7979;
    cursor: pointer;
    font-weight: 900;
}

.danger-button:hover:not(:disabled) {
    background: rgba(255, 88, 88, 0.22);
}

.danger-button.muted {
    border-color: rgba(255,255,255,0.14);
    background: rgba(255,255,255,0.04);
    color: #f0f0ea;
}

.danger-button:disabled {
    cursor: not-allowed;
    opacity: 0.65;
}

.danger-message[data-type="error"] {
    color: #ff7a7a;
}

@media (max-width: 980px) {
    .profile-cards-grid,
    .penalty-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .danger-actions {
        flex-direction: column;
    }

    .danger-button {
        width: 100%;
    }
}


/* ===== V11: e-mailes, végleges fióktörlés ===== */
.delete-password-field {
    display: grid;
    gap: 8px;
    margin-top: 18px;
    color: #f2f2eb;
    font-weight: 800;
}

.delete-password-field input {
    min-height: 48px;
    padding: 12px 14px;
    border: 1px solid rgba(255, 88, 88, 0.35);
    background: #080807;
    color: #f2f2eb;
    outline: none;
}

.delete-password-field input:focus {
    border-color: #ff6868;
}

.delete-token-panel {
    margin-top: 18px;
    padding: 18px;
    border: 1px solid rgba(255, 88, 88, 0.42);
    background: rgba(255, 88, 88, 0.08);
}

.delete-token-panel strong {
    color: #ff7373;
}

.delete-token-panel p {
    margin: 8px 0 0;
    color: #e1e1da;
    line-height: 1.65;
}
