/* Sign-in wall — faded preview of the section with a sign-in card on top */
.sign-in-wall-overlay {
    position: relative;
    min-height: 640px;
    padding: 8px 0 32px;
}
.sw-skeleton { opacity: 0.35; display: flex; flex-direction: column; gap: 16px; pointer-events: none; user-select: none; }
.sw-sk-title { height: 26px; width: 160px; border-radius: 6px; background: var(--bg-tertiary, #1E2329); }
.sw-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.sw-kpis > div, .sw-pair > div {
    height: 96px; border-radius: 14px;
    background: var(--bg-secondary, #161A1E); border: 1px solid var(--border-color, #2B3139);
}
.sw-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.sw-pair > div { height: 200px; }
.sw-heat {
    display: grid; grid-template-columns: repeat(12, 1fr); gap: 6px; padding: 20px;
    border-radius: 14px; background: var(--bg-secondary, #161A1E); border: 1px solid var(--border-color, #2B3139);
}
.sw-heat span { height: 34px; border-radius: 6px; background: #2B3139; }
.sw-heat .sw-t-g2 { background: rgba(14, 203, 129, 0.2); }
.sw-heat .sw-t-g3 { background: rgba(14, 203, 129, 0.3); }
.sw-heat .sw-t-g4 { background: rgba(14, 203, 129, 0.4); }
.sw-heat .sw-t-r2 { background: rgba(246, 70, 93, 0.2); }
.sw-heat .sw-t-r3 { background: rgba(246, 70, 93, 0.3); }
.sw-rows {
    display: flex; flex-direction: column; gap: 10px; padding: 20px;
    border-radius: 14px; background: var(--bg-secondary, #161A1E); border: 1px solid var(--border-color, #2B3139);
}
.sw-rows span { height: 34px; border-radius: 8px; background: #2B3139; }

.sw-veil {
    position: absolute; inset: 0;
    display: flex; align-items: flex-start; justify-content: center;
    padding: 96px 16px 0;
    background: linear-gradient(180deg, rgba(11, 14, 17, 0.2), rgba(11, 14, 17, 0.85) 40%);
}
.sw-card {
    width: 100%; max-width: 420px; box-sizing: border-box;
    display: flex; flex-direction: column; gap: 18px;
    padding: 28px; border-radius: 16px;
    background: var(--bg-secondary, #161A1E); border: 1px solid var(--border-color, #2B3139);
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.5);
    font-family: Inter, -apple-system, BlinkMacSystemFont, sans-serif;
}
.sw-icon {
    width: 44px; height: 44px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    background: rgba(240, 185, 11, 0.12); color: var(--accent, #F0B90B);
}
.sw-title { margin: 0; font-size: 1.25rem; font-weight: 600; letter-spacing: -0.2px; color: var(--text-primary, #EAECEF); }
.sw-sub { margin: 6px 0 0; font-size: 0.875rem; line-height: 1.5; color: var(--text-secondary, #848E9C); }
.sw-points { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; font-size: 0.8125rem; color: #B7BDC6; }
.sw-points li { display: flex; gap: 10px; align-items: flex-start; }
.sw-points svg { flex-shrink: 0; color: var(--green, #0ECB81); margin-top: 1px; }
.sw-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 640px) {
    .sw-actions > :only-child { grid-column: 1 / -1; }
}
.sw-btn { height: 44px; border-radius: 10px; font: 500 0.875rem Inter, sans-serif; cursor: pointer; }
.sw-btn--ghost { border: 1px solid var(--border-color, #2B3139); background: transparent; color: var(--text-primary, #EAECEF); }
.sw-btn--ghost:hover { border-color: #474D57; }
.sw-btn--primary { border: 0; background: var(--accent, #F0B90B); color: #0B0E11; font-weight: 600; }
.sw-btn--primary:hover { filter: brightness(1.05); }
.sw-btn:focus-visible { outline: 2px solid var(--accent, #F0B90B); outline-offset: 2px; }

@media (max-width: 760px) {
    .sign-in-wall-overlay { min-height: 560px; }
    .sw-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sw-pair { grid-template-columns: 1fr; }
    .sw-heat { grid-template-columns: repeat(6, 1fr); }
    .sw-veil { padding-top: 48px; }
    .sw-card { padding: 22px; }
}