/* ---------- Kapu, nyitóoldal, világlista ---------- */

.gate-loading {
    min-height: 100dvh;
    display: grid;
    place-items: center;
    color: var(--muted);
    letter-spacing: .12em;
}

.brand-link {
    cursor: pointer;
}

@media (max-width: 899px) {
    /* Mobilon a világlista a fejléc logójáról és a Beállításokból érhető el. */
    .nav-list .nav-worlds {
        display: none;
    }
}

.landing {
    position: relative;
    min-height: 100dvh;
    /* clip, nem hidden: a hidden az y tengelyt auto-ra állítja, és a .landing görgethető dobozzá válik – az animációk
       (hold, felhők, füst) törtpixeles túlnyúlásakor fel-felvillant benne egy függőleges görgetősáv, ami 15 px-szel
       összenyomta a tartalmat, és az egész oldal ugrált. */
    overflow-x: clip;
    overflow-y: visible;
    padding: 0 var(--gutter) 32px;
    background:
        radial-gradient(900px 600px at 78% 18%, rgba(226, 98, 43, .22), transparent 60%),
        radial-gradient(800px 500px at 10% 0%, rgba(232, 121, 249, .14), transparent 60%),
        radial-gradient(700px 500px at 50% 110%, rgba(34, 211, 238, .12), transparent 60%),
        var(--bg);
}

    .landing > *:not(.starfield):not(.valley-art) {
        position: relative;
        max-width: 1180px;
        margin-left: auto;
        margin-right: auto;
    }

/* Csillagmező: pár száz pont radiális gradiensekkel, lassú pislákolással. */
.starfield {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image:
        radial-gradient(1px 1px at 12% 18%, #fff, transparent),
        radial-gradient(1px 1px at 28% 72%, #cbd5e1, transparent),
        radial-gradient(1.5px 1.5px at 44% 12%, #fff, transparent),
        radial-gradient(1px 1px at 63% 44%, #e0f2fe, transparent),
        radial-gradient(1px 1px at 82% 8%, #fff, transparent),
        radial-gradient(1.5px 1.5px at 91% 62%, #f5d0fe, transparent),
        radial-gradient(1px 1px at 7% 52%, #fff, transparent),
        radial-gradient(1px 1px at 36% 38%, #a5f3fc, transparent),
        radial-gradient(1px 1px at 54% 88%, #fff, transparent),
        radial-gradient(1px 1px at 74% 28%, #fff, transparent);
    background-size: 380px 380px;
    opacity: .7;
    /* Saját név: a climate.css „twinkle” keyframe-je (scale + rotate) felülírta, és a csillagmező forogva-nagyítva
       túlnyúlt az oldalon – ettől villant fel és tűnt el a görgetősáv. */
    animation: starfield-twinkle 7s ease-in-out infinite alternate;
}

@keyframes starfield-twinkle {
    from { opacity: .45; }
    to { opacity: .85; }
}

.landing-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 0;
}

.landing-brand {
    font-weight: 800;
    letter-spacing: .3em;
    color: var(--accent);
    text-shadow: 0 0 14px rgba(34, 211, 238, .6);
}

.landing-top-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.lang-toggle {
    min-height: 40px;
    min-width: 44px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: transparent;
    color: var(--muted);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

/* ----- Hős ----- */

.hero {
    display: grid;
    gap: 8px;
    align-items: center;
    padding-top: 8px;
}

@media (min-width: 900px) {
    .hero {
        grid-template-columns: 1.05fr 1fr;
        gap: 32px;
        padding-top: 24px;
    }
}

.eyebrow {
    margin: 0 0 10px;
    color: var(--accent-2);
    font-size: .8rem;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.hero-title {
    margin: 0 0 14px;
    font-size: clamp(2.6rem, 9vw, 5rem);
    line-height: 1.02;
    letter-spacing: .02em;
    background: linear-gradient(90deg, #ffb27a, #e879f9 45%, #22d3ee);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: none;
    filter: drop-shadow(0 0 22px rgba(232, 121, 249, .25));
}

.hero-lead {
    margin: 0 0 22px;
    max-width: 58ch;
    font-size: 1.05rem;
    color: #c9d7ee;
}

.hero-cta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 22px;
}

    .hero-cta .btn {
        min-height: 48px;
        padding: 12px 22px;
        font-size: 1.02rem;
    }

.hero-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
}

    .hero-facts li {
        padding: 6px 12px;
        border: 1px solid var(--neon-line);
        border-radius: 999px;
        background: rgba(13, 20, 36, .6);
        font-size: .85rem;
        color: #c9d7ee;
    }

.hero-art {
    display: grid;
    place-items: center;
}

.planet-art {
    width: min(100%, 560px);
    height: auto;
    overflow: visible;
}

.pa-atmo {
    animation: atmo 6s ease-in-out infinite alternate;
    transform-origin: 300px 300px;
}

@keyframes atmo {
    from { opacity: .7; }
    to { opacity: 1; }
}

/* A terraformálás körforgása: por → víz és élet → felhők. */
.pa-life {
    animation: terraform 18s ease-in-out infinite;
}

.pa-dust {
    animation: dust 18s ease-in-out infinite;
}

.pa-clouds {
    animation: clouds 18s ease-in-out infinite;
}

@keyframes terraform {
    0%, 12% { opacity: 0; }
    45%, 80% { opacity: 1; }
    100% { opacity: 0; }
}

@keyframes dust {
    0%, 12% { opacity: 1; }
    45%, 80% { opacity: 0; }
    100% { opacity: 1; }
}

@keyframes clouds {
    0%, 25% { opacity: 0; transform: translateX(-20px); }
    55%, 80% { opacity: 1; transform: translateX(14px); }
    100% { opacity: 0; transform: translateX(30px); }
}

.pa-lights circle {
    animation: landing-blink 2.6s ease-in-out infinite alternate;
}

    .pa-lights circle:nth-child(2n) {
        animation-delay: 1.1s;
    }

@keyframes landing-blink {
    from { opacity: .35; }
    to { opacity: 1; }
}

/* ----- Látóhatár ----- */

.valley-art {
    display: block;
    position: relative;
    width: calc(100% + 2 * var(--gutter));
    margin: -40px calc(-1 * var(--gutter)) 0;
    height: clamp(120px, 18vw, 240px);
}

.va-window,
.va-blink {
    animation: landing-blink 3.2s ease-in-out infinite alternate;
}

.va-smoke circle,
.fa-smoke circle {
    animation: landing-smoke 4s ease-out infinite;
    transform-box: fill-box;
    transform-origin: center;
}

    .va-smoke circle:nth-child(2),
    .fa-smoke circle:nth-child(2) {
        animation-delay: 1.3s;
    }

    .va-smoke circle:nth-child(3),
    .fa-smoke circle:nth-child(3) {
        animation-delay: 2.6s;
    }

@keyframes landing-smoke {
    0% { transform: translateY(6px) scale(.7); opacity: 0; }
    30% { opacity: .9; }
    100% { transform: translateY(-14px) scale(1.25); opacity: 0; }
}

.va-belt,
.fa-belt,
.fa-route {
    animation: landing-belt 1.4s linear infinite;
}

@keyframes landing-belt {
    to { stroke-dashoffset: -28; }
}

/* ----- Belépés ----- */

.landing-auth {
    max-width: 640px !important;
    margin-top: 8px;
    margin-bottom: 40px;
    padding: 22px;
    border-color: rgba(34, 211, 238, .45);
    box-shadow: 0 0 40px rgba(34, 211, 238, .12), 0 20px 60px rgba(0, 0, 0, .45);
    scroll-margin-top: 16px;
}

    .landing-auth h2 {
        font-size: 1.3rem;
    }

    .landing-auth .confirm-row {
        margin-top: 12px;
    }

    .landing-auth .code-input {
        max-width: none;
    }

.auth-error {
    color: var(--danger);
    text-align: left;
    margin-top: 8px;
}

/* ----- Funkciók ----- */

.landing-section {
    margin-bottom: 48px;
    scroll-margin-top: 16px;
}

.section-title {
    font-size: clamp(1.4rem, 4vw, 2rem);
    margin-bottom: 18px;
    text-align: center;
    letter-spacing: .04em;
}

.feature-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px;
}

.feature-card {
    overflow: hidden;
    border: 1px solid var(--neon-line);
    border-radius: var(--radius);
    background: linear-gradient(180deg, rgba(20, 32, 57, .9), rgba(13, 20, 36, .9));
    box-shadow: 0 10px 30px rgba(0, 0, 0, .35);
    transition: transform .2s ease, box-shadow .2s ease;
}

    .feature-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 0 26px rgba(34, 211, 238, .18), 0 14px 36px rgba(0, 0, 0, .45);
    }

    .feature-card h3 {
        margin: 12px 14px 6px;
        font-size: 1.05rem;
    }

    .feature-card p {
        margin: 0 14px 16px;
        color: #b7c6df;
        font-size: .92rem;
    }

.feature-art {
    display: block;
    width: 100%;
    height: auto;
    border-bottom: 1px solid var(--neon-line);
}

.fa-door {
    animation: door 3s ease-in-out infinite alternate;
}

@keyframes door {
    from { filter: drop-shadow(0 0 2px #e879f9); }
    to { filter: drop-shadow(0 0 10px #e879f9); }
}

.fa-rain path {
    animation: rain 1.1s linear infinite;
}

    .fa-rain path:nth-child(2n) {
        animation-delay: .5s;
    }

@keyframes rain {
    from { transform: translate(0, 0); opacity: 0; }
    20% { opacity: 1; }
    to { transform: translate(-10px, 40px); opacity: 0; }
}

/* ----- Idézet és felvonások ----- */

.landing-quote {
    text-align: center;
    margin-bottom: 48px;
}

    .landing-quote blockquote {
        margin: 0 auto 8px;
        max-width: 30ch;
        font-size: clamp(1.3rem, 4vw, 2rem);
        font-style: italic;
        color: #f5d0fe;
        text-shadow: 0 0 24px rgba(232, 121, 249, .35);
    }

.acts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    list-style: none;
    margin: 0 0 24px;
    padding: 0;
}

.act {
    display: grid;
    gap: 4px;
    padding: 14px;
    border-radius: var(--radius);
    border: 1px solid var(--neon-line);
    text-align: center;
    font-weight: 600;
}

.act-num {
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--accent);
}

.act-1 { background: linear-gradient(160deg, rgba(120, 53, 15, .45), rgba(13, 20, 36, .9)); }
.act-2 { background: linear-gradient(160deg, rgba(146, 64, 14, .4), rgba(13, 20, 36, .9)); }
.act-3 { background: linear-gradient(160deg, rgba(91, 33, 182, .38), rgba(13, 20, 36, .9)); }
.act-4 { background: linear-gradient(160deg, rgba(14, 116, 144, .42), rgba(13, 20, 36, .9)); }
.act-5 { background: linear-gradient(160deg, rgba(162, 28, 175, .4), rgba(13, 20, 36, .9)); }

.landing-final {
    text-align: center;
}

    .landing-final .btn {
        min-height: 48px;
        padding: 12px 28px;
    }

.landing-footer {
    text-align: center;
    font-size: .8rem;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}

/* ----- Világlista ----- */

.lobby-head {
    padding: 16px 0 8px;
}

.lobby-title {
    font-size: clamp(2rem, 6vw, 3.2rem);
}

.world-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 14px;
    margin-bottom: 20px;
}

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

.lobby-empty {
    grid-column: 1 / -1;
    font-size: 1.05rem;
}

.world-card {
    display: grid;
    grid-template-columns: 84px 1fr;
    grid-template-rows: 1fr auto;
    gap: 6px 14px;
    padding: 14px;
    border: 1px solid var(--neon-line);
    border-radius: var(--radius);
    background: linear-gradient(160deg, rgba(20, 32, 57, .92), rgba(13, 20, 36, .92));
    box-shadow: 0 10px 30px rgba(0, 0, 0, .35);
}

    .world-card.here {
        border-color: rgba(34, 211, 238, .6);
        box-shadow: 0 0 24px rgba(34, 211, 238, .18), 0 10px 30px rgba(0, 0, 0, .35);
    }

.world-planet {
    width: 84px;
    height: 84px;
    grid-row: 1 / span 2;
    filter: drop-shadow(0 0 12px rgba(34, 211, 238, .2));
}

.world-info {
    min-width: 0;
}

.world-name {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 4px;
    font-size: 1.15rem;
    overflow-wrap: anywhere;
}

.world-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 12px;
    margin: 0 0 2px;
    font-size: .85rem;
}

.world-here {
    color: var(--accent);
}

/* Játékverzió: v1 = a befagyasztott eredeti, v2 = „Theia ébredése”. */
.world-version {
    padding: 0 8px;
    border-radius: 999px;
    border: 1px solid rgba(138, 160, 194, .45);
    color: #8aa0c2;
    font-size: .75rem;
    letter-spacing: .02em;
}

.world-version.v2 {
    border-color: rgba(34, 211, 238, .55);
    color: #67e8f9;
    background: linear-gradient(90deg, rgba(34, 211, 238, .12), rgba(232, 121, 249, .12));
}

.world-enter {
    justify-self: end;
    align-self: end;
}

.rename-row {
    display: flex;
    gap: 6px;
    align-items: center;
    margin-bottom: 4px;
}

    .rename-row .code-input {
        margin-bottom: 0;
    }

.lobby-device,
.lobby-new {
    max-width: 640px;
}

    .lobby-new .confirm-row,
    .lobby-new .btn {
        margin-top: 8px;
    }

    .lobby-new select {
        background: var(--panel-2);
        color: var(--text);
        border: 1px solid var(--border);
        border-radius: 8px;
        padding: 6px;
        font: inherit;
    }

@media (prefers-reduced-motion: reduce) {
    .starfield,
    .pa-atmo,
    .pa-life,
    .pa-dust,
    .pa-clouds,
    .pa-lights circle,
    .va-window,
    .va-blink,
    .va-smoke circle,
    .fa-smoke circle,
    .va-belt,
    .fa-belt,
    .fa-route,
    .fa-door,
    .fa-rain path {
        animation: none;
    }

    .pa-life,
    .pa-clouds {
        opacity: .6;
    }

    .pa-dust {
        opacity: .4;
    }
}

/* ---------- Közös bolygó: meghívók, tagok, admin (K0) ---------- */

.lobby-invites {
    margin: 0 0 18px;
}

.invite-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0;
    border-top: 1px solid var(--border);
}

    .invite-row:first-of-type {
        border-top: 0;
    }

.world-shared {
    color: var(--accent);
}

.world-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.world-members-wrap {
    grid-column: 1 / -1;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--border);
}

.world-members h3 {
    margin: 14px 0 6px;
}

.world-members .player-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.world-members .player-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    padding: 6px 0;
    border-top: 1px solid var(--border);
}

.world-members .player-text {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 160px;
}

.role-select, .kind-options {
    font: inherit;
}

.kind-options {
    margin-bottom: 8px;
}

.bare {
    min-height: 100dvh;
}

.bare-main {
    max-width: 880px;
    margin: 0 auto;
    padding: 0 var(--gutter) 32px;
}

.admin-head {
    justify-content: space-between;
}

.admin-tabs {
    margin: 12px 0;
    flex-wrap: wrap;
}

.admin-settings {
    display: grid;
    gap: 14px;
}

.admin-setting {
    display: grid;
    gap: 6px;
    padding: 10px 0;
    border-top: 1px solid var(--border);
}

.admin-setting .code-field {
    max-width: 220px;
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .9rem;
}

    .admin-table th, .admin-table td {
        text-align: left;
        padding: 6px 8px;
        border-bottom: 1px solid var(--border);
    }

.admin-facts {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 6px 14px;
    margin: 0 0 14px;
}

    .admin-facts dt {
        color: var(--muted);
    }

    .admin-facts dd {
        margin: 0;
    }

.admin-list {
    list-style: none;
    margin: 0 0 10px;
    padding: 0;
}

    .admin-list li {
        padding: 4px 0;
        border-top: 1px solid var(--border);
    }

.qr {
    max-width: 260px;
    margin: 12px 0;
    padding: 8px;
    background: #fff;
    border-radius: var(--radius);
}

    .qr svg {
        display: block;
        width: 100%;
        height: auto;
    }

.recovery-codes {
    list-style: none;
    margin: 0 0 14px;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 6px;
}

    .recovery-codes code {
        display: block;
        padding: 6px 8px;
        background: var(--panel-2);
        border-radius: 6px;
        font-size: 1.05rem;
        letter-spacing: .06em;
    }

.invite-page .hero-lead {
    margin-bottom: 14px;
}

/* ---------- K1: Planet View oldal, látogató nézet, slot-választó ---------- */

.planet-view-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 14px;
}

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

.planet-side h2 {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: baseline;
}

.slot-list {
    list-style: none;
    margin: 0 0 10px;
    padding: 0;
}

.slot-row {
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 6px 4px;
    border-top: 1px solid var(--border);
    cursor: pointer;
}

    .slot-row.selected {
        background: rgba(34, 211, 238, .08);
        border-radius: 6px;
    }

    .slot-row.empty {
        opacity: .65;
    }

.slot-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex: none;
    box-shadow: 0 0 8px currentColor;
}

.member-card {
    border-top: 1px solid var(--border);
    padding-top: 10px;
}

    .member-card h3 {
        border-left: 4px solid var(--member, var(--accent));
        padding-left: 8px;
        margin-bottom: 6px;
    }

.visit-banner {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    padding: 6px var(--gutter);
    background: rgba(232, 121, 249, .16);
    border-bottom: 1px solid rgba(232, 121, 249, .45);
}

/* Látogató nézet: a parancsgombok rejtve (a szerver sem fogadja el őket); a navigáció és a nézet-gombok maradnak. */
.visiting .main .btn:not(.visit-ok),
.visiting .main .decision-option,
.visiting .main .chip,
.visiting .main .speed-option:not([role=tab]),
.visiting .main .inbox-badge,
.visiting .topbar .inbox-badge,
.visiting .topbar .vault-badge {
    display: none !important;
}

.slot-picker svg {
    width: 100%;
    max-width: 320px;
    display: block;
    margin: 0 auto 10px;
}

.slot-mark circle {
    fill: #1d2c4a;
    stroke: var(--muted);
    stroke-width: 1.5;
}

.slot-mark.free circle {
    fill: #0f766e;
    stroke: var(--ok);
    cursor: pointer;
}

.slot-mark.selected circle {
    fill: var(--accent);
    stroke: #fff;
}

.slot-mark.back {
    opacity: .4;
}

.slot-mark text {
    fill: #fff;
    font-size: 10px;
    pointer-events: none;
}

.slot-mark .slot-name {
    font-size: 8px;
    fill: var(--muted);
}

.slot-options {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
}

/* ---------- K2: Áttekintés ---------- */

.contrib-table td.warn {
    color: var(--warn);
}

.contrib-table tr.me td {
    background: rgba(34, 211, 238, .06);
}

.report-top {
    list-style: none;
    margin: 6px 0;
    padding: 0;
}

.meter-cap.floor {
    border-left: 2px dashed var(--ok);
}

.history-chart .line.instability {
    stroke: var(--danger);
    stroke-dasharray: 4 3;
}

.throttle-row {
    align-items: flex-end;
}

/* ---- K3: Planet Chat, tervtábla, szavazások, jelölők ---- */
.planet-chat { display: flex; flex-direction: column; gap: 0.6rem; }
.chat-channels { flex-wrap: wrap; }
.chat-log { max-height: 50vh; overflow-y: auto; display: flex; flex-direction: column; gap: 0.5rem; padding: 0.25rem; }
.chat-row { padding: 0.4rem 0.6rem; border-radius: 10px; background: var(--card-bg, rgba(255,255,255,0.04)); }
.chat-row.mine { background: rgba(120, 180, 255, 0.10); }
.chat-row.system { background: rgba(255, 210, 120, 0.10); font-style: italic; }
.chat-row p { margin: 0.2rem 0 0; white-space: pre-wrap; word-break: break-word; }
.chat-head { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
.chat-head .icon-btn.small { font-size: 0.8rem; padding: 0 0.2rem; opacity: 0.6; }
.chat-head .icon-btn.small:hover { opacity: 1; }
.chat-card { display: inline-flex; align-items: center; gap: 0.3rem; margin-top: 0.3rem; padding: 0.3rem 0.6rem; border-radius: 8px; border: 1px solid var(--line, rgba(255,255,255,0.15)); background: transparent; color: inherit; cursor: pointer; }
.chat-compose { display: flex; gap: 0.4rem; }
.chat-compose input { flex: 1; letter-spacing: normal; text-transform: none; }
.plan-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 0.75rem; }
.plan-card h3 { margin-top: 0; }
.plan-card .pledges { margin: 0.4rem 0; padding-left: 1rem; font-size: 0.9rem; }
.vote-card.closed { opacity: 0.75; }
.vote-options { display: flex; flex-direction: column; gap: 0.4rem; }
.vote-option { position: relative; display: flex; justify-content: space-between; align-items: center; padding: 0.5rem 0.75rem; border-radius: 8px; border: 1px solid var(--line, rgba(255,255,255,0.15)); background: transparent; color: inherit; cursor: pointer; overflow: hidden; text-align: left; }
.vote-option i { position: absolute; left: 0; top: 0; bottom: 0; background: rgba(120, 180, 255, 0.18); z-index: 0; }
.vote-option span, .vote-option small { position: relative; z-index: 1; }
.vote-option.active { border-color: var(--accent, #8ec5ff); font-weight: 600; }
.vote-option:disabled { cursor: default; }
.pin-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.4rem; }
.pin-row { display: flex; align-items: center; gap: 0.5rem; padding: 0.4rem 0.6rem; border-radius: 8px; background: var(--card-bg, rgba(255,255,255,0.04)); }
.pin-row.highlighted { outline: 1px solid rgba(255, 210, 120, 0.6); }
.pin-row .player-text { flex: 1; display: flex; flex-direction: column; }
.pin-icon { font-size: 1.3rem; }
.map-pin-marker { pointer-events: none; font-size: 0.9rem; }

/* ---- K4: piac, fuvar, energia ---- */
.order-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.5rem; }
.order-row { display: flex; align-items: center; gap: 0.6rem; padding: 0.5rem 0.7rem; border-radius: 10px; background: var(--card-bg, rgba(255,255,255,0.04)); flex-wrap: wrap; }
.order-row.mine { outline: 1px solid rgba(142, 197, 255, 0.5); }
.order-row.npc { background: rgba(255, 210, 120, 0.07); }
.order-row .player-text { flex: 1; display: flex; flex-direction: column; min-width: 220px; }
.lots-input { width: 5rem; }
.chat-note { width: 100%; letter-spacing: normal; text-transform: none; margin: 0.4rem 0; }
.rate-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0.4rem; }
.rate-list li { display: flex; align-items: center; gap: 0.4rem; }
.rate-list .pos { color: #8ef0b5; }
.rate-list .neg { color: #ffb08a; }
.spark { width: 70px; height: 20px; }
.spark polyline { fill: none; stroke: #8ec5ff; stroke-width: 1.5; }
.energy-table td.warn { color: #ffb08a; }
.energy-table td.pos { color: #8ef0b5; }
.pledge-form-row td { background: rgba(142, 197, 255, 0.08); }
.contract-done { opacity: 0.8; }
.contract-expired { opacity: 0.5; }

/* ---- K5: üstökösök és Megaprojectek ---- */
.comet-row.resolved { opacity: 0.6; }
.comet-vote { flex-wrap: wrap; }
.comet-vote .btn.active { outline: 2px solid var(--accent, #8ec5ff); }
.mega-cards { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.mega-card h4 { margin: 0 0 0.3rem; }
.mega-tower { display: flex; flex-direction: column; gap: 0.4rem; }
.mega-phase { padding: 0.4rem 0.6rem; border-radius: 8px; background: rgba(255,255,255,0.03); border-left: 3px solid rgba(255,255,255,0.12); }
.mega-phase.done { border-left-color: #8ef0b5; opacity: 0.85; }
.mega-phase.current { border-left-color: #8ec5ff; background: rgba(142,197,255,0.08); }
.mega-phase.future { opacity: 0.55; }
.mega-phase-head { display: flex; justify-content: space-between; gap: 0.5rem; }
.mega-items { margin: 0.3rem 0; padding-left: 1rem; font-size: 0.9rem; }

/* ---- K7: Derelict Colony-k ---- */
.derelict-card.revived { border-left: 3px solid #8ef0b5; }

/* ---- S1–S3: Star Clock, szezon, örökség, kozmetikumok ---- */
.star-clock { display: flex; align-items: center; gap: 0.6rem; padding: 0.35rem 1rem; background: linear-gradient(90deg, rgba(255,180,80,calc(0.08 + 0.3 * var(--si, 0))), rgba(255,90,60,calc(0.05 + 0.25 * var(--si, 0)))); color: inherit; text-decoration: none; font-size: 0.9rem; border-bottom: 1px solid rgba(255,160,80,0.25); }
.star-icon { display: inline-block; animation: star-pulse calc(2.4s - 1.6s * var(--si, 0)) ease-in-out infinite; filter: hue-rotate(calc(-40deg * var(--si, 0))); }
@keyframes star-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.18); } }
@media (prefers-reduced-motion: reduce) { .star-icon { animation: none; } }
.star-clock-row { display: flex; align-items: center; gap: 0.8rem; }
.star-clock-row .star-icon { font-size: 2rem; }
.star-text { display: flex; flex-direction: column; }
.si-bar .meter-fill { background: linear-gradient(90deg, #ffd27a, #ff6b4a); }
.phase-track { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 0.6rem; }
.phase-step { padding: 0.4rem 0.6rem; border-radius: 8px; background: rgba(255,255,255,0.04); border-top: 3px solid rgba(255,255,255,0.15); }
.phase-step.done { border-top-color: #8ef0b5; }
.phase-step.current { border-top-color: #8ec5ff; }
.task-card.done { opacity: 0.7; }
.task-card.expired { opacity: 0.5; }
.board-list { margin: 0.3rem 0; padding-left: 1.2rem; }
.board-list li.me { font-weight: 600; color: #8ec5ff; }
.board-list .muted { float: right; }
.legacy-item.unavailable { opacity: 0.6; }
.lobby-seasons .invite-row { align-items: center; }
html[data-cosmetic-sky="aurora"] .topbar { box-shadow: inset 0 -2px 0 rgba(120, 255, 200, 0.5); }
html[data-cosmetic-sky="ember"] .topbar { box-shadow: inset 0 -2px 0 rgba(255, 140, 80, 0.6); }
html[data-cosmetic-valley="frost"] .main { background-image: linear-gradient(180deg, rgba(180, 220, 255, 0.04), transparent 40%); }
html[data-cosmetic-valley="bloom"] .main { background-image: linear-gradient(180deg, rgba(160, 255, 180, 0.05), transparent 40%); }
html[data-cosmetic-frame="gold"] .specialist-portrait, html[data-cosmetic-frame="gold"] .portrait { outline: 2px solid #ffd27a; }