/* ============================================================
   SITW SIDEBAR NAVIGATION v2.1 — Cyberpunk Matrix Edition
   ============================================================ */

:root {
    --sb-width:       240px;
    --sb-collapsed:    64px;
    --sb-bg:          #050809;
    --sb-border:      rgba(0,255,136,0.08);
    --sb-text:        rgba(0,255,136,0.22);
    --sb-text-active: rgba(0,255,136,0.85);
    --sb-accent:      #7b2fff;
    --sb-cyan:        #00f5ff;
    --sb-green:       #00ff88;
    --sb-transition:  0.26s cubic-bezier(.4,0,.2,1);
}

/* ── BASE ───────────────────────────────────────────────── */
#sitw-sidebar {
    position: fixed;
    left: 0; top: 0; bottom: 0;
    width: var(--sb-width);
    background: var(--sb-bg);
    display: flex;
    flex-direction: column;
    z-index: 9999;
    overflow: hidden;
    transition: width var(--sb-transition);
    border-right: none;
}

body.sitw-sb-collapsed #sitw-sidebar {
    width: var(--sb-collapsed);
}

/* ── RAIN CANVAS ────────────────────────────────────────── */
#sitw-sb-rain {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    opacity: 0.07;
}

/* ── SCANLINES ──────────────────────────────────────────── */
#sitw-sidebar::before {
    content: '';
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        0deg,
        rgba(0,0,0,0.13) 0px, rgba(0,0,0,0.13) 1px,
        transparent 1px, transparent 4px
    );
    pointer-events: none;
    z-index: 1;
}

/* ── RIGHT BORDER ANIMATED ──────────────────────────────── */
#sitw-sidebar::after {
    content: '';
    position: absolute;
    right: 0; top: 0; bottom: 0;
    width: 1px;
    background: linear-gradient(
        to bottom,
        transparent,
        rgba(0,255,136,0.00) 5%,
        rgba(0,255,136,0.35) 25%,
        rgba(123,47,255,0.20) 50%,
        rgba(0,255,136,0.35) 75%,
        rgba(0,255,136,0.00) 95%,
        transparent
    );
    z-index: 10;
    animation: sitw-border-glow 5s ease-in-out infinite;
}

@keyframes sitw-border-glow {
    0%, 100% { opacity: 0.5; }
    50%       { opacity: 1;   }
}

/* ── TOP / LOGO AREA ────────────────────────────────────── */
.sitw-sb-top {
    padding: 20px 18px 16px;
    position: relative;
    z-index: 5;
    flex-shrink: 0;
    border-bottom: 1px solid rgba(0,255,136,0.05);
}

.sitw-sb-logo-main {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 26px;
    color: #00e060;
    letter-spacing: 0.12em;
    text-shadow: 0 0 18px rgba(0,224,96,0.5), 0 0 40px rgba(0,224,96,0.15);
    line-height: 1;
    margin-bottom: 3px;
    white-space: nowrap;
    overflow: hidden;
    transition: font-size var(--sb-transition), letter-spacing var(--sb-transition);
}

body.sitw-sb-collapsed .sitw-sb-logo-main {
    font-size: 13px;
    letter-spacing: 0.05em;
}

.sitw-sb-logo-sub {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 8px;
    color: rgba(0,255,136,0.2);
    letter-spacing: 0.38em;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    transition: opacity var(--sb-transition);
}

body.sitw-sb-collapsed .sitw-sb-logo-sub { opacity: 0; }

/* ── STATUS PILL ────────────────────────────────────────── */
.sitw-sb-status {
    margin-top: 14px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 4px 9px;
    border: 1px solid rgba(0,255,136,0.1);
    border-radius: 2px;
    background: rgba(0,255,136,0.03);
    white-space: nowrap;
    overflow: hidden;
    transition: opacity var(--sb-transition);
}

body.sitw-sb-collapsed .sitw-sb-status { opacity: 0; }

.sitw-sb-status-dot {
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--sb-green);
    box-shadow: 0 0 6px var(--sb-green);
    flex-shrink: 0;
    animation: sitw-dot-pulse 2.5s ease-in-out infinite;
}

@keyframes sitw-dot-pulse {
    0%, 100% { opacity: 1;    box-shadow: 0 0 6px var(--sb-green); }
    50%       { opacity: 0.15; box-shadow: none; }
}

.sitw-sb-status-txt {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 8px;
    color: rgba(0,255,136,0.3);
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

/* ── TOGGLE BUTTON ──────────────────────────────────────── */
.sitw-sb-toggle {
    position: absolute;
    top: 14px; right: 14px;
    width: 28px; height: 28px;
    background: transparent;
    border: 1px solid rgba(0,255,136,0.12);
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    transition: all 0.2s;
    z-index: 6;
    padding: 0;
}

.sitw-sb-toggle:hover {
    border-color: rgba(0,255,136,0.35);
    background: rgba(0,255,136,0.05);
}

.sitw-sb-toggle .hbl {
    width: 11px; height: 1px;
    background: rgba(0,255,136,0.35);
    transition: background 0.2s;
}

.sitw-sb-toggle:hover .hbl { background: rgba(0,255,136,0.7); }

/* ── NAV ────────────────────────────────────────────────── */
.sitw-sb-nav {
    padding: 12px 8px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    list-style: none;
    position: relative;
    z-index: 5;
    flex-shrink: 0;
    margin: 0;
}

.sitw-sb-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px 10px 12px;
    border-radius: 2px 14px 14px 2px;
    text-decoration: none;
    position: relative;
    overflow: hidden;
    transition: background 0.22s, box-shadow 0.22s, border-color 0.22s;
    border: 1px solid rgba(0,255,136,0.06);
    border-left: 2px solid rgba(0,255,136,0.12);
    cursor: pointer;
}

/* hover sweep left → right */
.sitw-sb-link::before {
    content: '';
    position: absolute;
    left: -100%; top: 0; bottom: 0;
    width: 100%;
    background: linear-gradient(90deg, rgba(0,255,136,0.00), rgba(0,255,136,0.06));
    transition: left 0.28s ease;
    z-index: 0;
}

.sitw-sb-link:hover {
    background: rgba(0,255,136,0.04);
    border-color: rgba(0,255,136,0.16);
    border-left-color: rgba(0,255,136,0.55);
    box-shadow: 0 0 20px rgba(0,255,136,0.07);
}
.sitw-sb-link:hover::before { left: 0; }
.sitw-sb-link:hover .sitw-sb-n { color: rgba(0,255,136,0.55); }
.sitw-sb-link:hover .sitw-sb-t { color: rgba(0,255,136,0.8); }

/* ACTIVE */
.sitw-sb-link.sitw-sb-active {
    background: rgba(0,255,136,0.05);
    border-color: rgba(0,255,136,0.18);
    border-left-color: #00ff88;
    box-shadow: 0 0 24px rgba(0,255,136,0.10), inset 0 0 12px rgba(0,255,136,0.02);
}
.sitw-sb-link.sitw-sb-active .sitw-sb-n { color: rgba(0,255,136,0.7); }
.sitw-sb-link.sitw-sb-active .sitw-sb-t { color: rgba(0,255,136,0.92); }

/* active left bar — not needed, border-left handles it */
.sitw-sb-link::after { display: none; }

.sitw-sb-link:focus-visible {
    outline: 2px solid rgba(0,255,136,0.45);
    outline-offset: -2px;
}

/* ── NÚMERO ─────────────────────────────────────────────── */
.sitw-sb-n {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 8px;
    letter-spacing: 0.08em;
    color: rgba(0,255,136,0.22);
    flex-shrink: 0;
    min-width: 16px;
    transition: color 0.22s;
    position: relative;
    z-index: 1;
    line-height: 1;
}

/* ── TEXTO ──────────────────────────────────────────────── */
.sitw-sb-t {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 10px;
    letter-spacing: 0.14em;
    color: rgba(0,255,136,0.30);
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    max-width: 150px;
    transition: opacity var(--sb-transition), color 0.22s,
                max-width var(--sb-transition);
    position: relative;
    z-index: 1;
}

body.sitw-sb-collapsed .sitw-sb-t {
    opacity: 0;
    max-width: 0;
}

/* ── ARROW ──────────────────────────────────────────────── */
.sitw-sb-arrow {
    position: absolute;
    right: 10px;
    font-family: 'Share Tech Mono', monospace;
    font-size: 12px;
    color: rgba(0,255,136,0.3);
    opacity: 0;
    transform: translateX(-5px);
    transition: opacity 0.18s, transform 0.18s;
    z-index: 1;
}

.sitw-sb-link:hover .sitw-sb-arrow,
.sitw-sb-link.sitw-sb-active .sitw-sb-arrow {
    opacity: 1;
    transform: translateX(0);
}

body.sitw-sb-collapsed .sitw-sb-arrow { display: none; }

/* ── BADGE ──────────────────────────────────────────────── */
.sitw-sb-badge {
    margin-left: auto;
    min-width: 16px; height: 16px;
    padding: 0 4px;
    background: #ff3366;
    border-radius: 8px;
    font-family: 'Share Tech Mono', monospace;
    font-size: 8px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
    animation: sitw-badge-pulse 2s ease-in-out infinite;
}

@keyframes sitw-badge-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,51,102,0.5); }
    60%       { box-shadow: 0 0 0 5px rgba(255,51,102,0); }
}

body.sitw-sb-collapsed .sitw-sb-badge {
    position: absolute;
    top: 4px; right: 4px;
    min-width: 8px; height: 8px;
    font-size: 0;
    padding: 0;
    border-radius: 50%;
}

/* ── TOOLTIP (collapsed + desktop only) ─────────────────── */
.sitw-sb-tooltip {
    position: absolute;
    left: 68px; top: 50%;
    transform: translateY(-50%) translateX(-6px);
    background: #0a0f0b;
    border: 1px solid rgba(0,255,136,0.2);
    border-radius: 3px;
    padding: 5px 10px;
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 9px;
    color: rgba(0,255,136,0.7);
    letter-spacing: 0.12em;
    white-space: nowrap;
    z-index: 200;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.16s, transform 0.16s;
}

body.sitw-sb-collapsed .sitw-sb-link:hover .sitw-sb-tooltip {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

/* ── SEPARATOR ──────────────────────────────────────────── */
.sitw-sb-sep {
    height: 1px;
    background: rgba(0,255,136,0.06);
    margin: 5px 4px;
    list-style: none;
}

/* ── CTA CONTRATAR ──────────────────────────────────────── */
.sitw-sb-link.sitw-sb-cta {
    background: rgba(0,255,136,0.04);
    border-color: rgba(0,255,136,0.10);
    margin-top: 2px;
}

.sitw-sb-link.sitw-sb-cta .sitw-sb-icon { color: rgba(0,255,136,0.35); }
.sitw-sb-link.sitw-sb-cta .sitw-sb-t { color: rgba(0,255,136,0.40); }

.sitw-sb-link.sitw-sb-cta:hover {
    background: rgba(0,255,136,0.08);
    border-color: rgba(0,255,136,0.25);
}

.sitw-sb-link.sitw-sb-cta:hover .sitw-sb-t { color: rgba(0,255,136,0.7); }

/* ── SPACER ─────────────────────────────────────────────── */
.sitw-sb-spacer { flex: 1; }

/* ── USER CARD ──────────────────────────────────────────── */
.sitw-sb-user {
    margin: 8px 10px 12px;
    padding: 10px;
    border-radius: 4px;
    border: 1px solid rgba(0,255,136,0.08);
    background: rgba(0,255,136,0.02);
    display: flex;
    align-items: center;
    gap: 9px;
    text-decoration: none;
    position: relative;
    z-index: 5;
    transition: all 0.2s;
    overflow: hidden;
    flex-shrink: 0;
}

.sitw-sb-user::before {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(90deg, rgba(0,255,136,0), rgba(0,255,136,0.06));
    opacity: 0;
    transition: opacity 0.2s;
}

.sitw-sb-user:hover::before { opacity: 1; }
.sitw-sb-user:hover { border-color: rgba(0,255,136,0.2); }

.sitw-sb-avatar {
    width: 32px; height: 32px;
    flex-shrink: 0;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Bebas Neue', 'Courier New', sans-serif;
    font-size: 13px;
    color: #fff;
    box-shadow: 0 0 10px rgba(123,47,255,0.35);
    transition: box-shadow 0.2s;
}

.sitw-sb-user:hover .sitw-sb-avatar {
    box-shadow: 0 0 16px rgba(123,47,255,0.55);
}

.sitw-sb-user-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
    overflow: hidden;
    max-width: 130px;
    transition: opacity var(--sb-transition), max-width var(--sb-transition);
}

body.sitw-sb-collapsed .sitw-sb-user-meta { opacity: 0; max-width: 0; }

.sitw-sb-user-name {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 12px;
    font-weight: 400;
    color: rgba(255,255,255,0.55);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sitw-sb-user-role {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 8px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.sitw-sb-user-dots {
    margin-left: auto;
    color: rgba(0,255,136,0.15);
    flex-shrink: 0;
    line-height: 1;
    transition: color 0.2s, opacity var(--sb-transition);
}

.sitw-sb-user:hover .sitw-sb-user-dots { color: rgba(0,255,136,0.4); }
body.sitw-sb-collapsed .sitw-sb-user-dots { opacity: 0; width: 0; overflow: hidden; }

/* ── MOBILE BRAND (mobile top bar) ─────────────────────── */
.sitw-sb-brand {
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    overflow: hidden;
    white-space: nowrap;
}

.sitw-sb-brand-icon {
    width: 28px; height: 28px;
    min-width: 28px;
    background: var(--sb-accent);
    color: #fff;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Bebas Neue', 'Courier New', monospace;
    font-size: 14px;
    font-weight: 900;
}

.sitw-sb-brand-name {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 13px;
    letter-spacing: 1px;
    color: rgba(0,255,136,0.7);
}

.sitw-sb-brand-name strong { color: var(--sb-accent); font-weight: 900; }

/* ── MOBILE TOP BAR ─────────────────────────────────────── */
.sitw-mobile-bar {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0;
    height: 56px;
    background: var(--sb-bg);
    border-bottom: 1px solid rgba(0,255,136,0.06);
    align-items: center;
    justify-content: space-between;
    padding: 0 16px;
    z-index: 9998;
}

.sitw-mobile-menu-btn {
    background: transparent;
    border: none;
    color: rgba(0,255,136,0.5);
    cursor: pointer;
    padding: 6px;
    position: relative;
    display: flex;
    align-items: center;
}

.sitw-mobile-notif {
    position: absolute;
    top: 4px; right: 4px;
    width: 8px; height: 8px;
    background: #ff3366;
    border-radius: 50%;
}

.sitw-mobile-avatar {
    width: 34px; height: 34px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-family: monospace; font-size: 12px; font-weight: 900;
    color: #fff; text-decoration: none;
}

/* ── OVERLAY ────────────────────────────────────────────── */
.sitw-sb-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(5,8,9,0.7);
    z-index: 9997;
    backdrop-filter: blur(3px);
}

body.sitw-sb-open .sitw-sb-overlay { display: block; }

/* ── MAIN CONTENT OFFSET ────────────────────────────────── */
body:has(#sitw-sidebar) #page {
    margin-left: var(--sb-width) !important;
    transition: margin-left var(--sb-transition);
}

body.sitw-sb-collapsed:has(#sitw-sidebar) #page {
    margin-left: var(--sb-collapsed) !important;
}

body:not(.sitw-sb-collapsed) .sitw-main-content,
body:not(.sitw-sb-collapsed) #wpcontent,
body:not(.sitw-sb-collapsed) .pdi-page-wrapper { margin-left: var(--sb-width); }

body.sitw-sb-collapsed .sitw-main-content,
body.sitw-sb-collapsed #wpcontent,
body.sitw-sb-collapsed .pdi-page-wrapper  { margin-left: var(--sb-collapsed); }

/* ── RESPONSIVE MOBILE ──────────────────────────────────── */
@media (max-width: 768px) {
    .sitw-mobile-bar { display: flex; }

    #sitw-sidebar {
        transform: translateX(-100%);
        transition: transform var(--sb-transition);
        width: var(--sb-width) !important;
        box-shadow: 4px 0 32px rgba(0,0,0,0.7);
    }

    body.sitw-sb-open #sitw-sidebar { transform: translateX(0); }

    body:has(#sitw-sidebar) #page {
        margin-left: 0 !important;
        padding-top: 56px;
    }

    .sitw-main-content,
    #wpcontent,
    .pdi-page-wrapper { margin-left: 0 !important; }

    /* ensure text visible when open on mobile */
    .sitw-sb-text, .sitw-sb-brand-name, .sitw-sb-user-meta, .sitw-sb-user-dots {
        opacity: 1 !important;
        max-width: none !important;
        width: auto !important;
        margin-left: 10px !important;
    }

    .sitw-sb-toggle { display: none; }
}


/* ============================================================
   PÁGINA DE PERFIL (kept in sidebar.css for co-location)
   ============================================================ */

.sitw-perfil-wrap {
    max-width: 860px;
    margin: 0 auto;
    padding: 48px 40px 80px;
}

.sitw-perfil-header {
    display: flex;
    align-items: flex-start;
    gap: 32px;
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    margin-bottom: 40px;
}

.sitw-perfil-avatar-wrap { position: relative; flex-shrink: 0; }

.sitw-perfil-avatar {
    width: 88px; height: 88px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-family: 'Courier New', monospace;
    font-size: 28px; font-weight: 900; color: #fff;
    transition: background 0.3s;
    border: 2px solid rgba(255,255,255,0.1);
}

.sitw-perfil-avatar-edit {
    position: absolute; bottom: 2px; right: 2px;
    width: 24px; height: 24px;
    background: #1a1a28;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; color: rgba(255,255,255,0.6);
    transition: all 0.2s; padding: 0;
}
.sitw-perfil-avatar-edit:hover { border-color: var(--sb-accent); color: var(--sb-accent); }

.sitw-avatar-palette {
    position: absolute; top: calc(100% + 8px); left: 0;
    display: flex; flex-wrap: wrap; gap: 6px;
    background: #1a1a28;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 10px; padding: 10px;
    z-index: 100; width: 120px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.5);
}

.sitw-avatar-swatch {
    width: 24px; height: 24px;
    border-radius: 50%;
    border: 2px solid transparent;
    cursor: pointer; padding: 0;
    transition: transform 0.15s, border-color 0.15s;
}
.sitw-avatar-swatch:hover { transform: scale(1.2); border-color: #fff; }

.sitw-perfil-identity { flex: 1; min-width: 0; }
.sitw-perfil-name-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.sitw-perfil-name { font-size: clamp(22px, 3vw, 32px); font-weight: 900; color: #fff; margin: 0; letter-spacing: 1px; }

.sitw-perfil-edit-btn {
    background: transparent;
    border: 1px solid rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.35);
    width: 26px; height: 26px;
    border-radius: 6px;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; padding: 0;
    transition: all 0.2s; flex-shrink: 0;
}
.sitw-perfil-edit-btn:hover { border-color: var(--sb-accent); color: var(--sb-accent); }
.sitw-inline-form { margin-top: 8px; }
.sitw-name-input { max-width: 320px; font-size: 16px; }

.sitw-perfil-rol-badge {
    display: inline-block;
    padding: 3px 12px; border: 1px solid;
    font-family: 'Courier New', monospace;
    font-size: 9px; letter-spacing: 3px;
    text-transform: uppercase;
    margin: 8px 0 6px;
}
.sitw-perfil-email { font-family: 'Courier New', monospace; font-size: 12px; color: rgba(255,255,255,0.35); margin: 0 0 4px; }
.sitw-perfil-since { font-family: 'Courier New', monospace; font-size: 10px; color: rgba(255,255,255,0.2); letter-spacing: 1px; margin: 0; }

.sitw-perfil-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.sitw-perfil-col { display: flex; flex-direction: column; gap: 20px; }

.sitw-perfil-card {
    background: rgba(255,255,255,0.025);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 12px; padding: 24px;
    transition: border-color 0.2s;
}
.sitw-perfil-card:hover { border-color: rgba(123,47,255,0.25); }
.sitw-perfil-card-empty { border-style: dashed; }
.sitw-perfil-card-title { font-family: 'Courier New', monospace; font-size: 10px; letter-spacing: 3px; color: var(--sb-cyan); margin: 0 0 20px; }

.sitw-perfil-row { display: flex; gap: 16px; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,0.04); align-items: center; }
.sitw-perfil-row:last-child { border-bottom: none; }
.sitw-perfil-row-label { font-family: 'Courier New', monospace; font-size: 9px; letter-spacing: 2px; color: rgba(255,255,255,0.25); min-width: 76px; text-transform: uppercase; }
.sitw-perfil-row-val { font-size: 13px; color: rgba(255,255,255,0.75); word-break: break-word; }
.sitw-perfil-empty { font-family: 'Courier New', monospace; font-size: 11px; color: rgba(255,255,255,0.2); line-height: 1.7; margin: 0; }

.sitw-btn-sm { padding: 10px 20px; font-family: 'Courier New', monospace; font-size: 10px; letter-spacing: 2px; font-weight: 700; cursor: pointer; text-transform: uppercase; transition: all 0.2s; border: none; }
.sitw-btn-ghost { background: transparent; border: 1px solid rgba(255,255,255,0.15); color: rgba(255,255,255,0.4); }
.sitw-btn-ghost:hover { border-color: #fff; color: #fff; }
.sitw-btn-danger { background: transparent; border: 1px solid rgba(255,68,68,0.3); color: rgba(255,68,68,0.7); padding: 10px 20px; font-family: 'Courier New', monospace; font-size: 10px; letter-spacing: 2px; font-weight: 700; cursor: pointer; text-transform: uppercase; transition: all 0.2s; }
.sitw-btn-danger:hover { border-color: #ff4444; color: #ff4444; background: rgba(255,68,68,0.05); }

/* ── Panel de la cuenta: navegación lateral + secciones ────────────────────
   El header ocupa todo el ancho; debajo, nav a la izquierda y contenido a la
   derecha. En mobile la nav se vuelve una fila con scroll horizontal, que es
   más usable que un acordeón cuando son 4-6 secciones. */

.sitw-perfil-wrap { max-width: 1080px; }

.sitw-perfil-avatar.has-foto,
.sitw-perfil-foto-preview.has-foto { background: none !important; }
.sitw-perfil-avatar img,
.sitw-perfil-foto-preview img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }

.sitw-perfil-layout { display: grid; grid-template-columns: 236px 1fr; gap: 32px; align-items: start; }

.sitw-perfil-nav { display: flex; flex-direction: column; gap: 4px; position: sticky; top: 24px; }

.sitw-perfil-nav-item {
    display: block; padding: 12px 14px; border-radius: 10px;
    border: 1px solid transparent; text-decoration: none;
    transition: background .18s, border-color .18s;
}
.sitw-perfil-nav-item strong {
    display: block; font-size: 13px; font-weight: 700;
    color: rgba(255,255,255,.72); letter-spacing: .3px;
}
.sitw-perfil-nav-item small {
    display: block; margin-top: 3px; font-size: 10.5px; line-height: 1.45;
    color: rgba(255,255,255,.28);
}
.sitw-perfil-nav-item:hover { background: rgba(255,255,255,.03); }
.sitw-perfil-nav-item.is-active {
    background: rgba(123,47,255,.10); border-color: rgba(123,47,255,.32);
}
.sitw-perfil-nav-item.is-active strong { color: #fff; }
.sitw-perfil-nav-item.is-active small { color: rgba(255,255,255,.42); }

.sitw-perfil-main { display: flex; flex-direction: column; gap: 20px; min-width: 0; }

/* ── Formularios ── */
.sitw-perfil-form { display: block; }
.sitw-perfil-label {
    display: block; margin-bottom: 7px;
    font-family: 'Courier New', monospace; font-size: 9px; letter-spacing: 2px;
    text-transform: uppercase; color: rgba(255,255,255,.32);
}
.sitw-perfil-form .sitw-input { width: 100%; }
.sitw-perfil-form textarea.sitw-input { resize: vertical; min-height: 96px; line-height: 1.6; }

.sitw-perfil-wrap .sitw-form-msg { margin: 12px 0 0; font-size: 11px; }

.sitw-perfil-details { margin-top: 22px; border-top: 1px solid rgba(255,255,255,.06); padding-top: 16px; }
.sitw-perfil-details summary {
    cursor: pointer; font-size: 12px; color: rgba(255,255,255,.45);
    list-style: none; user-select: none;
}
.sitw-perfil-details summary::-webkit-details-marker { display: none; }
.sitw-perfil-details summary::before { content: '+ '; color: var(--sb-cyan); }
.sitw-perfil-details[open] summary::before { content: '− '; }
.sitw-perfil-details summary:hover { color: #fff; }

.sitw-avatar-palette-inline { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 10px; }

/* ── Foto ── */
.sitw-perfil-foto-row { display: flex; gap: 24px; align-items: flex-start; flex-wrap: wrap; }
.sitw-perfil-foto-preview {
    width: 104px; height: 104px; border-radius: 50%; flex: none;
    display: flex; align-items: center; justify-content: center;
    font-family: 'Courier New', monospace; font-size: 30px; font-weight: 900; color: #fff;
    border: 2px solid rgba(255,255,255,.1); overflow: hidden;
}
.sitw-perfil-foto-actions { flex: 1; min-width: 200px; }
.sitw-perfil-foto-actions label { cursor: pointer; }

/* ── Mis cursos ── */
.sitw-perfil-cursos { display: flex; flex-direction: column; gap: 16px; }
.sitw-perfil-curso {
    border: 1px solid rgba(255,255,255,.07); border-radius: 12px; padding: 20px;
    background: rgba(255,255,255,.015);
}
.sitw-perfil-curso-head { display: flex; gap: 12px; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; }
.sitw-perfil-curso-head h3 { margin: 0; font-size: 15px; font-weight: 800; color: #fff; letter-spacing: .2px; }
.sitw-perfil-curso-desc { margin: 10px 0 0; font-size: 12.5px; line-height: 1.6; color: rgba(255,255,255,.5); }
.sitw-perfil-curso-meta {
    display: flex; gap: 14px; flex-wrap: wrap; margin: 14px 0 16px;
    font-family: 'Courier New', monospace; font-size: 10px; letter-spacing: 1.4px;
    text-transform: uppercase; color: rgba(255,255,255,.3);
}
.sitw-perfil-curso-precio { color: var(--sb-cyan) !important; }
.sitw-perfil-precio-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.sitw-perfil-precio-row .sitw-input { max-width: 160px; }
.sitw-perfil-precio-row select.sitw-input {
    min-width: 190px; padding: 10px 34px 10px 12px;
    border: 1px solid rgba(255,255,255,.13); border-radius: 9px;
    background: #17171e; color: #fff;
}
.sitw-perfil-ganancia { margin: 11px 0 0; color: rgba(255,255,255,.44); font-size: 11.5px; line-height: 1.55; }
.sitw-perfil-ganancia strong { color: #c58cff; }
.sitw-perfil-curso-links {
    display: flex; gap: 18px; flex-wrap: wrap; margin-top: 16px;
    font-family: 'Courier New', monospace; font-size: 9.5px; letter-spacing: 1.4px;
}

/* ── Monetización ── */
.sitw-perfil-saldo-hero {
    text-align: center; padding: 26px 20px 24px; margin-bottom: 22px;
    border: 1px solid rgba(123,47,255,.24); border-radius: 12px;
    background: linear-gradient(160deg, rgba(123,47,255,.10), rgba(0,212,255,.05));
}
.sitw-perfil-saldo-label {
    display: block; font-family: 'Courier New', monospace; font-size: 9px;
    letter-spacing: 2.6px; text-transform: uppercase; color: rgba(255,255,255,.4);
}
.sitw-perfil-saldo-num {
    display: block; margin: 8px 0 4px; font-size: clamp(32px, 6vw, 46px);
    font-weight: 900; color: #fff; letter-spacing: -1px; line-height: 1;
}
.sitw-perfil-saldo-num.is-negativo { color: #ff6b6b; }
.sitw-perfil-saldo-eq { font-family: 'Courier New', monospace; font-size: 12px; color: rgba(255,255,255,.45); }

.sitw-perfil-saldos {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(126px, 1fr)); gap: 10px;
}
.sitw-perfil-saldo-item {
    border: 1px solid rgba(255,255,255,.06); border-radius: 9px; padding: 12px 14px;
}
.sitw-perfil-saldo-item span {
    display: block; font-family: 'Courier New', monospace; font-size: 8.5px;
    letter-spacing: 1.8px; text-transform: uppercase; color: rgba(255,255,255,.3);
}
.sitw-perfil-saldo-item strong { display: block; margin-top: 5px; font-size: 17px; color: rgba(255,255,255,.82); }

.sitw-perfil-retiro { margin: 24px 0 6px; }
.sitw-perfil-retiro button[disabled] { opacity: .4; cursor: not-allowed; }

.sitw-perfil-legal {
    margin-top: 24px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.06);
}
.sitw-perfil-legal p { font-size: 12px; line-height: 1.75; color: rgba(255,255,255,.42); margin: 0 0 12px; }
.sitw-perfil-legal p:last-child { margin-bottom: 0; }
.sitw-perfil-legal strong { color: rgba(255,255,255,.7); }

/* ── Billetera de compras ── */
.sitw-wallet-summary { display: flex; justify-content: space-between; align-items: center; gap: 28px; margin-bottom: 22px; }
.sitw-wallet-summary > div:first-child > p:last-child { max-width: 500px; margin: 8px 0 0; color: rgba(255,255,255,.46); font-size: 13px; line-height: 1.6; }
.sitw-wallet-balance { flex: none; min-width: 190px; padding: 18px 20px; border: 1px solid rgba(163,71,255,.25); border-radius: 14px; background: rgba(163,71,255,.07); }
.sitw-wallet-balance span, .sitw-wallet-balance small { display: block; color: rgba(255,255,255,.4); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.sitw-wallet-balance strong { display: inline-block; margin: 7px 7px 4px 0; color: #fff; font-size: 30px; line-height: 1; }
.sitw-wallet-balance small { display: inline; color: #c58cff; font-weight: 700; }
.sitw-wallet-movements { display: flex; flex-direction: column; }
.sitw-wallet-movement { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.06); }
.sitw-wallet-movement:last-child { border-bottom: 0; }
.sitw-wallet-movement strong { display: block; color: rgba(255,255,255,.8); font-size: 13px; }
.sitw-wallet-movement span { display: block; margin-top: 4px; color: rgba(255,255,255,.32); font-size: 10px; }
.sitw-wallet-movement b { flex: none; font-size: 13px; font-weight: 650; }
.sitw-wallet-movement b.is-credit { color: #52dda0; }
.sitw-wallet-movement b.is-debit { color: #ff8797; }

.sitw-perfil-movs { display: flex; flex-direction: column; }
.sitw-perfil-mov {
    display: flex; gap: 16px; align-items: center; justify-content: space-between;
    padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,.045); flex-wrap: wrap;
}
.sitw-perfil-mov:last-child { border-bottom: none; }
.sitw-perfil-mov strong { display: block; font-size: 13px; color: rgba(255,255,255,.78); }
.sitw-perfil-mov small {
    display: block; margin-top: 3px; font-family: 'Courier New', monospace;
    font-size: 10px; letter-spacing: 1px; color: rgba(255,255,255,.28);
}
.sitw-perfil-mov-num { display: flex; align-items: center; gap: 12px; }
.sitw-perfil-mov-num strong { font-size: 15px; color: #00ff88; }
.sitw-perfil-mov-num strong.is-negativo { color: #ff6b6b; }

/* ── Responsive ── */
@media (max-width: 900px) {
    .sitw-perfil-layout { grid-template-columns: 1fr; gap: 22px; }
    .sitw-perfil-nav {
        position: static; flex-direction: row; gap: 8px;
        overflow-x: auto; scrollbar-width: none;
        margin: 0 -20px; padding: 0 20px 4px;
    }
    .sitw-perfil-nav::-webkit-scrollbar { display: none; }
    .sitw-perfil-nav-item { flex: none; padding: 10px 16px; border-color: rgba(255,255,255,.08); }
    .sitw-perfil-nav-item small { display: none; }
}

@media (max-width: 640px) {
    .sitw-perfil-wrap { padding: 24px 20px 60px; }
    .sitw-perfil-header { flex-direction: column; align-items: center; text-align: center; }
    .sitw-perfil-name-row { justify-content: center; }
    .sitw-perfil-foto-row { flex-direction: column; align-items: center; text-align: center; }
    .sitw-perfil-foto-actions { text-align: center; }
    .sitw-perfil-curso-head { flex-direction: column; }
    .sitw-perfil-mov { align-items: flex-start; }
    .sitw-wallet-summary { align-items: stretch; flex-direction: column; }
    .sitw-wallet-balance { width: 100%; }
}

/* ── Correcciones del QA visual del 2026-08-07 ────────────────────────────
   Todo lo de acá abajo existe por especificidad: Astra estiliza `input[type=…]`
   y `.entry-content a`, que son (0,1,1), y le ganan a una clase suelta (0,1,0).
   Anteponer .sitw-perfil-wrap sube a (0,2,0) y alcanza, sin usar !important.
   Es el mismo truco que ya usaba .sitw-auth-card en auth.css. */

.sitw-perfil-wrap input.sitw-input,
.sitw-perfil-wrap textarea.sitw-input {
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(0, 245, 255, .25);
    border-radius: 0;
    padding: 12px 0;
    color: #fff;
    font-size: 15px;
    height: auto;          /* Astra inyecta height:40px por CSS inline */
    box-shadow: none;
}
.sitw-perfil-wrap input.sitw-input:focus,
.sitw-perfil-wrap textarea.sitw-input:focus {
    border-bottom-color: #00f5ff;
    background: rgba(0, 245, 255, .03);
    box-shadow: none;
    outline: none;
}
.sitw-perfil-wrap input.sitw-input::placeholder,
.sitw-perfil-wrap textarea.sitw-input::placeholder { color: rgba(255,255,255,.22); }

/* La nav se leía subrayada. La regla que gana es de Astra e inline:
   `.ast-single-post .entry-content a`, que es (0,2,1) — le gana a una clase
   sola precedida del wrap, (0,2,0). Con tres clases, (0,3,0), alcanza.
   El subrayado se dibuja en el <a>: ponérselo sólo a los hijos no lo saca. */
.sitw-perfil-wrap .sitw-perfil-nav .sitw-perfil-nav-item,
.sitw-perfil-wrap .sitw-perfil-nav .sitw-perfil-nav-item:hover,
.sitw-perfil-wrap .sitw-perfil-nav .sitw-perfil-nav-item * { text-decoration: none; }

/* Un asiento revertido ya no cuenta para el saldo. Mostrarlo en verde y en
   positivo, igual que una venta viva, hacía leer plata que no está. */
.sitw-perfil-wrap .sitw-perfil-mov.is-reversed strong,
.sitw-perfil-wrap .sitw-perfil-mov.is-reversed small { color: rgba(255,255,255,.3); }
.sitw-perfil-wrap .sitw-perfil-mov.is-reversed .sitw-perfil-mov-num strong {
    color: rgba(255,255,255,.3); text-decoration: line-through;
}

/* Un `display` de autor le gana al atributo `hidden`, que el navegador aplica
   con display:none desde su hoja de estilos. Sin esto, la regla de abajo hacía
   visible el botón QUITAR aunque la persona no tuviera foto cargada. */
.sitw-perfil-wrap [hidden] { display: none !important; }

/* Los botones ocupaban todo el ancho de la tarjeta y pesaban de más. */
.sitw-perfil-wrap .sitw-btn-sm,
.sitw-perfil-wrap .sitw-btn-primary,
.sitw-perfil-wrap .sitw-btn-ghost,
.sitw-perfil-wrap .sitw-btn-danger {
    display: inline-block;
    width: auto;
    border-radius: 8px;
}

/* rgba(255,255,255,.2) sobre fondo casi negro no se leía. */
.sitw-perfil-wrap .sitw-perfil-empty { color: rgba(255,255,255,.42); font-size: 12px; }
.sitw-perfil-wrap .sitw-perfil-since { color: rgba(255,255,255,.34); }
.sitw-perfil-wrap .sitw-perfil-row-label { color: rgba(255,255,255,.42); }
.sitw-perfil-wrap .sitw-perfil-curso-meta { color: rgba(255,255,255,.46); }
.sitw-perfil-wrap .sitw-perfil-nav-item small { color: rgba(255,255,255,.38); }
.sitw-perfil-wrap .sitw-perfil-nav-item.is-active small { color: rgba(255,255,255,.55); }

/* Seis estados en cuatro columnas dejaban una fila coja de dos. */
.sitw-perfil-saldos { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 520px) { .sitw-perfil-saldos { grid-template-columns: repeat(2, 1fr); } }

/* ══════════════════════════════════════════════════════════════════════════
   ÁREA DE CUENTA — sistema tipográfico
   ══════════════════════════════════════════════════════════════════════════

   El portal se escribió con estética de terminal: Courier New en absolutamente
   todo, mayúsculas con 2-3px de letter-spacing, y títulos prefijados con `//`.
   Se leía como una consola, no como la cuenta de alguien, y no se parecía en
   nada al sitio público, que usa Inter y es limpio y tipográfico.

   Acá el área de cuenta pasa a Inter. El monospace no desaparece: queda para lo
   que de verdad es un dato técnico —fechas, importes, códigos, saldos—, donde
   el ancho fijo ayuda a comparar cifras alineadas y además aporta carácter.

   Todo va dentro de `body.sitw-cuenta` (ver includes/sidebar.php) para no tocar
   la home ni las páginas públicas, que tienen su propio lenguaje.
   ══════════════════════════════════════════════════════════════════════════ */

body.sitw-cuenta {
    --ct-font: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --ct-mono: 'Share Tech Mono', 'Courier New', monospace;
}

/* ── Base ── */
body.sitw-cuenta .sitw-tracker-wrap,
body.sitw-cuenta .sitw-perfil-wrap,
body.sitw-cuenta .entry-content > div {
    font-family: var(--ct-font);
}

/* ── Títulos: se va el peso 900 en mayúsculas apretadas ── */
body.sitw-cuenta .sitw-auth-title {
    font-family: var(--ct-font);
    font-weight: 600;
    font-size: clamp(26px, 3.4vw, 38px);
    letter-spacing: -0.5px;
    text-transform: none;
    line-height: 1.15;
}
body.sitw-cuenta .sitw-auth-sub {
    font-family: var(--ct-font);
    font-size: 14.5px;
    letter-spacing: 0;
    color: rgba(255,255,255,.45);
    text-transform: none;
}

/* La etiqueta de arriba del título: era `SYS:CUENTA · NOMBRE` en monospace.
   Ahora es sólo el nombre, discreto. */
body.sitw-cuenta .sitw-sys-label {
    font-family: var(--ct-font);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(255,255,255,.32);
}

body.sitw-cuenta .sitw-perfil-name {
    font-family: var(--ct-font);
    font-weight: 600;
    letter-spacing: -0.6px;
}
body.sitw-cuenta .sitw-perfil-avatar,
body.sitw-cuenta .sitw-perfil-foto-preview { font-family: var(--ct-font); font-weight: 600; }

/* ── Etiquetas de sección: eran `// FOTO DE PERFIL` en cyan ── */
body.sitw-cuenta .sitw-perfil-card-title {
    font-family: var(--ct-font);
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: rgba(255,255,255,.38);
}
body.sitw-cuenta .sitw-perfil-label,
body.sitw-cuenta .sitw-perfil-row-label {
    font-family: var(--ct-font);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .06em;
}

/* ── Cuerpo ── */
body.sitw-cuenta .sitw-perfil-empty,
body.sitw-cuenta .sitw-alert-desc,
body.sitw-cuenta .sitw-perfil-legal p,
body.sitw-cuenta .sitw-perfil-curso-desc {
    font-family: var(--ct-font);
    font-size: 13px;
    line-height: 1.65;
}
body.sitw-cuenta .sitw-alert-title {
    font-family: var(--ct-font);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
}

/* ── Botones: 3px de letter-spacing en mayúsculas es un botón de consola ── */
body.sitw-cuenta .sitw-btn-primary,
body.sitw-cuenta .sitw-btn-secondary,
body.sitw-cuenta .sitw-btn-ghost,
body.sitw-cuenta .sitw-btn-danger,
body.sitw-cuenta .sitw-btn-destructive,
body.sitw-cuenta .sitw-btn-sm {
    font-family: var(--ct-font);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
    border-radius: 999px;
    padding: 10px 20px;
}

/* ── Chips: pastillas, no rectángulos ── */
body.sitw-cuenta .sitw-chip {
    font-family: var(--ct-font);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .02em;
    text-transform: none;
    border-radius: 999px;
    padding: 4px 11px;
}
body.sitw-cuenta .sitw-perfil-rol-badge {
    font-family: var(--ct-font);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .06em;
    border-radius: 999px;
    padding: 4px 12px;
}

/* ── Enlaces ── */
body.sitw-cuenta .sitw-link,
body.sitw-cuenta .sitw-perfil-curso-links {
    font-family: var(--ct-font);
    font-size: 12.5px;
    letter-spacing: 0;
    text-transform: none;
}

/* ── Donde el monospace SÍ suma: cifras y datos ── */
body.sitw-cuenta .sitw-perfil-since,
body.sitw-cuenta .sitw-perfil-email,
body.sitw-cuenta .sitw-perfil-saldo-num,
body.sitw-cuenta .sitw-perfil-saldo-eq,
body.sitw-cuenta .sitw-perfil-saldo-item strong,
body.sitw-cuenta .sitw-perfil-mov-num strong,
body.sitw-cuenta .sitw-perfil-curso-precio,
body.sitw-cuenta .sitw-tdate {
    font-family: var(--ct-mono);
    letter-spacing: .02em;
}

/* Encabezado del perfil: nombre y rol en la misma línea, y los datos
   secundarios en una sola fila discreta. Antes eran cuatro líneas apiladas
   —nombre, chip, mail, fecha— que ocupaban lo mismo que una tarjeta entera. */
body.sitw-cuenta .sitw-perfil-name-row { flex-wrap: wrap; gap: 14px; margin-bottom: 10px; }
body.sitw-cuenta .sitw-perfil-meta {
    display: flex; align-items: center; gap: 9px; flex-wrap: wrap;
    margin: 0; font-family: var(--ct-font); font-size: 13px;
    color: rgba(255,255,255,.4);
}
body.sitw-cuenta .sitw-perfil-meta-sep { color: rgba(255,255,255,.18); }
body.sitw-cuenta .sitw-perfil-header { align-items: center; gap: 26px; padding-bottom: 32px; margin-bottom: 32px; }

/* ── /mi-cuenta-nuevo/ sin plan ──────────────────────────────────────────
   Era una tarjeta de 440px centrada en una pantalla negra de 800 de alto.
   Ahora la pantalla explica el camino y ofrece a dónde ir mientras tanto. */

body.sitw-cuenta .sitw-tracker-wrap { max-width: 980px; margin: 0 auto; padding: 48px 40px 90px; }

.sitw-cta-hero {
    display: grid; grid-template-columns: 1.15fr .85fr; gap: 42px; align-items: center;
    margin: 34px 0 46px; padding: 38px 40px;
    border: 1px solid rgba(123,47,255,.22); border-radius: 18px;
    background: linear-gradient(140deg, rgba(123,47,255,.13), rgba(0,212,255,.05) 70%);
}
.sitw-cta-hero-copy h2 {
    margin: 0 0 12px; font-size: clamp(20px, 2.4vw, 26px); font-weight: 600;
    color: #fff; letter-spacing: -.4px; line-height: 1.25;
}
.sitw-cta-hero-copy p {
    margin: 0 0 22px; font-size: 14px; line-height: 1.65; color: rgba(255,255,255,.55);
}
body.sitw-cuenta .sitw-cta-hero-btn {
    display: inline-block; width: auto; padding: 12px 26px; font-size: 14px;
    text-decoration: none;
}

.sitw-cta-pasos { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.sitw-cta-pasos li { display: flex; gap: 14px; align-items: flex-start; }
.sitw-cta-pasos span {
    flex: none; width: 26px; height: 26px; border-radius: 50%;
    display: grid; place-items: center;
    background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14);
    font-size: 12px; font-weight: 600; color: rgba(255,255,255,.75);
}
.sitw-cta-pasos strong { display: block; font-size: 13.5px; font-weight: 600; color: rgba(255,255,255,.88); }
.sitw-cta-pasos small { display: block; margin-top: 2px; font-size: 12px; color: rgba(255,255,255,.4); line-height: 1.5; }

.sitw-mientras { margin-top: 44px; padding-top: 30px; border-top: 1px solid rgba(255,255,255,.06); }
.sitw-mientras-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 14px; margin-top: 16px;
}
.sitw-mientras-card {
    display: block; padding: 20px; border-radius: 13px; text-decoration: none;
    border: 1px solid rgba(255,255,255,.07); background: rgba(255,255,255,.02);
    transition: border-color .2s, background .2s, transform .2s;
}
.sitw-mientras-card:hover {
    border-color: rgba(123,47,255,.35); background: rgba(123,47,255,.05);
    transform: translateY(-2px);
}
.sitw-mientras-card strong { display: block; font-size: 14.5px; font-weight: 600; color: #fff; margin-bottom: 6px; }
.sitw-mientras-card span { display: block; font-size: 12.5px; line-height: 1.6; color: rgba(255,255,255,.45); }

@media (max-width: 820px) {
    .sitw-cta-hero { grid-template-columns: 1fr; gap: 30px; padding: 30px 24px; }
    body.sitw-cuenta .sitw-tracker-wrap { padding: 32px 20px 70px; }
}

/* Astra subraya todo <a> dentro de .entry-content con (0,2,1). Las tarjetas y
   los pasos del área de cuenta necesitan (0,3,0) para ganarle, igual que la
   navegación del perfil. */
body.sitw-cuenta .sitw-mientras .sitw-mientras-card,
body.sitw-cuenta .sitw-mientras .sitw-mientras-card *,
body.sitw-cuenta .sitw-cta-hero .sitw-cta-hero-btn,
body.sitw-cuenta .sitw-tracker-wrap .sitw-btn-primary,
body.sitw-cuenta .sitw-tracker-wrap .sitw-btn-secondary,
body.sitw-cuenta .sitw-tracker-wrap .sitw-btn-destructive { text-decoration: none; }

/* Tarjetas de estadística del panel de admin. Antes cada una decía el nombre
   del estado dos veces —etiqueta chica arriba y chip a la derecha— con el
   número enorme en el medio. Ahora: número, y el chip hace de etiqueta. */
body.sitw-cuenta .sitw-admin-stat {
    border: 1px solid rgba(255,255,255,.07); border-radius: 13px;
    padding: 22px 20px; display: flex; flex-direction: column;
    align-items: flex-start; gap: 14px;
}
body.sitw-cuenta .sitw-admin-stat-num {
    font-size: 40px; font-weight: 700; color: #fff; line-height: 1; margin: 0;
}
body.sitw-cuenta .sitw-table th {
    font-family: var(--ct-font); font-size: 11px; font-weight: 600;
    letter-spacing: .06em; text-transform: uppercase; color: rgba(255,255,255,.34);
}
body.sitw-cuenta .sitw-admin-search input {
    font-family: var(--ct-font); font-size: 13.5px; letter-spacing: 0;
    border-radius: 999px; padding: 12px 20px;
}

/* Las etiquetas de los saldos quedaron en monospace a .3 de opacidad: se leían
   como ruido. Los NÚMEROS sí siguen en mono, que es donde el ancho fijo sirve
   para comparar cifras entre tarjetas. */
body.sitw-cuenta .sitw-perfil-saldo-item span,
body.sitw-cuenta .sitw-perfil-saldo-label,
body.sitw-cuenta .sitw-perfil-mov small,
body.sitw-cuenta .sitw-perfil-curso-meta,
body.sitw-cuenta .sitw-tname {
    font-family: var(--ct-font);
    font-size: 11.5px;
    font-weight: 500;
    letter-spacing: .05em;
    color: rgba(255,255,255,.45);
}
body.sitw-cuenta .sitw-perfil-saldo-label { font-size: 12px; letter-spacing: .08em; }
body.sitw-cuenta .sitw-perfil-mov small { letter-spacing: 0; font-weight: 400; }

/* ══════════════════════════════════════════════════════════════════════════
   PERFIL DE COMUNIDAD
   La cuenta se comporta como un perfil social; el tracker queda como producto
   separado y sólo existe para personas con un proyecto iniciado.
   ══════════════════════════════════════════════════════════════════════════ */

body.sitw-cuenta {
    --pf-bg: #08080b;
    --pf-surface: #111116;
    --pf-surface-2: #17171e;
    --pf-line: rgba(255,255,255,.09);
    --pf-muted: rgba(245,242,250,.58);
    --pf-purple: #a347ff;
    --pf-purple-soft: #c58cff;
    background: var(--pf-bg);
}

body.sitw-cuenta #page,
body.sitw-cuenta .site-content,
body.sitw-cuenta .ast-container,
body.sitw-cuenta .entry-content { background: var(--pf-bg); }

body.sitw-cuenta .sitw-perfil-wrap {
    width: min(1180px, calc(100% - 48px));
    max-width: none;
    margin: 0 auto;
    padding: 36px 0 96px;
}

body.sitw-cuenta .sitw-perfil-header {
    display: block;
    margin: 0 0 28px;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--pf-line);
    border-radius: 28px;
    background: var(--pf-surface);
    box-shadow: 0 28px 80px rgba(0,0,0,.24);
}

body.sitw-cuenta .sitw-perfil-cover {
    position: relative;
    height: 180px;
    overflow: hidden;
    background:
        radial-gradient(600px 230px at 18% 20%, rgba(204,133,255,.52), transparent 66%),
        radial-gradient(480px 210px at 86% 12%, rgba(93,49,192,.45), transparent 70%),
        linear-gradient(118deg, #26103e 0%, #120b22 48%, #0d0c15 100%);
}

body.sitw-cuenta .sitw-perfil-cover::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
    background-size: 44px 44px;
    mask-image: linear-gradient(90deg, #000, transparent 82%);
    opacity: .25;
}

body.sitw-cuenta .sitw-perfil-cover::after {
    content: "";
    position: absolute;
    width: 280px;
    height: 280px;
    right: 6%;
    top: -130px;
    border: 1px solid rgba(220,182,255,.2);
    border-radius: 50%;
    box-shadow: 0 0 0 34px rgba(190,113,255,.035), 0 0 0 68px rgba(190,113,255,.025);
}

body.sitw-cuenta .sitw-perfil-cover span {
    position: absolute;
    left: 36px;
    top: 30px;
    color: rgba(255,255,255,.72);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .2em;
}

body.sitw-cuenta .sitw-perfil-header-inner {
    position: relative;
    display: grid;
    grid-template-columns: 122px minmax(0,1fr) auto;
    gap: 0 24px;
    align-items: start;
    margin-top: -58px;
    padding: 0 36px 30px;
}

body.sitw-cuenta .sitw-perfil-avatar {
    width: 118px;
    height: 118px;
    border: 5px solid var(--pf-surface);
    box-shadow: 0 0 0 1px rgba(255,255,255,.16), 0 15px 36px rgba(0,0,0,.35);
    font-size: 32px;
}

body.sitw-cuenta .sitw-perfil-identity { padding-top: 70px; }
body.sitw-cuenta .sitw-perfil-name-row { gap: 12px; margin: 0 0 4px; }
body.sitw-cuenta .sitw-perfil-name { font-size: clamp(25px,3vw,36px); font-weight: 680; letter-spacing: -.035em; }

body.sitw-cuenta .sitw-perfil-handle {
    margin: 0;
    color: rgba(245,242,250,.45);
    font-size: 13px;
}

body.sitw-cuenta .sitw-perfil-bio {
    max-width: 680px;
    margin: 13px 0 0;
    color: rgba(245,242,250,.78);
    font-size: 14px;
    line-height: 1.65;
}

body.sitw-cuenta .sitw-perfil-site {
    display: inline-block;
    margin-top: 9px;
    color: var(--pf-purple-soft);
    font-size: 13px;
    text-decoration: none;
}

body.sitw-cuenta .sitw-perfil-public-btn {
    align-self: start;
    margin-top: 69px;
    padding: 10px 17px;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 999px;
    background: rgba(255,255,255,.045);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: border-color .2s, background .2s, transform .2s;
}

body.sitw-cuenta .sitw-perfil-public-btn:hover {
    border-color: rgba(195,130,255,.7);
    background: rgba(163,71,255,.12);
    transform: translateY(-1px);
}

body.sitw-cuenta .sitw-perfil-stats {
    grid-column: 2 / -1;
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
    margin-top: 22px;
    padding-top: 21px;
    border-top: 1px solid var(--pf-line);
}

body.sitw-cuenta .sitw-perfil-stats div { min-width: 88px; }
body.sitw-cuenta .sitw-perfil-stats strong { display: block; color: #fff; font-size: 18px; line-height: 1; }
body.sitw-cuenta .sitw-perfil-stats span { display: block; margin-top: 6px; color: rgba(245,242,250,.42); font-size: 11.5px; }

body.sitw-cuenta .sitw-perfil-layout {
    grid-template-columns: 250px minmax(0,1fr);
    gap: 24px;
}

body.sitw-cuenta .sitw-perfil-nav {
    gap: 5px;
    top: 92px;
    padding: 10px;
    border: 1px solid var(--pf-line);
    border-radius: 20px;
    background: var(--pf-surface);
}

body.sitw-cuenta .sitw-perfil-nav-item { padding: 13px 14px; border-radius: 13px; }
body.sitw-cuenta .sitw-perfil-nav-item strong { font-size: 13px; font-weight: 620; }
body.sitw-cuenta .sitw-perfil-nav-item small { margin-top: 4px; font-size: 11px; }
body.sitw-cuenta .sitw-perfil-nav-item.is-active {
    border-color: rgba(176,91,255,.34);
    background: linear-gradient(115deg, rgba(163,71,255,.18), rgba(163,71,255,.06));
}

body.sitw-cuenta .sitw-perfil-main { gap: 16px; }
body.sitw-cuenta .sitw-perfil-card {
    padding: 27px;
    border-color: var(--pf-line);
    border-radius: 20px;
    background: var(--pf-surface);
    box-shadow: 0 18px 44px rgba(0,0,0,.12);
}
body.sitw-cuenta .sitw-perfil-card:hover { border-color: rgba(255,255,255,.14); }
body.sitw-cuenta .sitw-perfil-card-title { margin-bottom: 22px; color: rgba(245,242,250,.48); }

body.sitw-cuenta .sitw-perfil-wrap input.sitw-input,
body.sitw-cuenta .sitw-perfil-wrap textarea.sitw-input {
    padding: 13px 14px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 12px;
    background: #0c0c11;
}
body.sitw-cuenta .sitw-perfil-wrap input.sitw-input:focus,
body.sitw-cuenta .sitw-perfil-wrap textarea.sitw-input:focus {
    border-color: rgba(176,91,255,.7);
    background: #0e0d14;
    box-shadow: 0 0 0 3px rgba(163,71,255,.1);
}

body.sitw-cuenta .sitw-perfil-curso {
    padding: 22px;
    border-color: var(--pf-line);
    border-radius: 17px;
    background: var(--pf-surface-2);
}
body.sitw-cuenta .sitw-perfil-curso-head h3 { font-size: 17px; }
body.sitw-cuenta .sitw-perfil-curso-links { align-items: center; gap: 10px; }
body.sitw-cuenta .sitw-perfil-curso-links .sitw-btn-sm { text-decoration: none; }

body.sitw-cuenta .sitw-perfil-notice {
    padding: 14px 17px;
    border: 1px solid rgba(116,234,165,.28);
    border-radius: 14px;
    background: rgba(74,190,118,.08);
    color: #a9efc4;
    font-size: 13px;
}
body.sitw-cuenta .sitw-perfil-library { display: grid; gap: 13px; }
body.sitw-cuenta .sitw-perfil-library-course {
    display: grid;
    grid-template-columns: minmax(0,1fr) 170px auto;
    gap: 20px;
    align-items: center;
    padding: 20px;
    border: 1px solid var(--pf-line);
    border-radius: 16px;
    background: var(--pf-surface-2);
}
body.sitw-cuenta .sitw-perfil-library-course h3 { margin: 5px 0 6px; color: #fff; font-size: 16px; }
body.sitw-cuenta .sitw-perfil-library-course p,
body.sitw-cuenta .sitw-perfil-library-course span { margin: 0; color: rgba(245,242,250,.45); font-size: 11.5px; }
body.sitw-cuenta .sitw-perfil-library-progress { height: 7px; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.08); }
body.sitw-cuenta .sitw-perfil-library-progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#7b2fff,#c86cff); }
body.sitw-cuenta .sitw-perfil-library-course .sitw-btn-sm { text-decoration: none; white-space: nowrap; }
body.sitw-cuenta .sitw-perfil-library-empty { padding: 26px; border: 1px dashed rgba(255,255,255,.13); border-radius: 16px; text-align: center; }
body.sitw-cuenta .sitw-perfil-library-empty strong { color: #fff; font-size: 17px; }
body.sitw-cuenta .sitw-perfil-library-empty p { max-width: 520px; margin: 9px auto 18px; color: var(--pf-muted); font-size: 13px; line-height: 1.6; }
body.sitw-cuenta .sitw-perfil-library-empty .sitw-btn-sm { text-decoration: none; }

/* ── SITWCOINS ───────────────────────────────────────────────────────── */
body.sitw-cuenta .sitw-coins-card {
    padding: 0;
    overflow: hidden;
    background:
        radial-gradient(520px 260px at 0 0, rgba(151,62,242,.17), transparent 68%),
        var(--pf-surface);
}

body.sitw-cuenta .sitw-coins-balance {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 32px;
    border-bottom: 1px solid var(--pf-line);
}
body.sitw-cuenta .sitw-coins-balance img {
    width: 104px;
    height: 104px;
    flex: none;
    filter: drop-shadow(0 18px 28px rgba(126,42,216,.38));
}
body.sitw-cuenta .sitw-coins-name {
    display: block;
    margin-bottom: 8px;
    color: var(--pf-purple-soft);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .18em;
}
body.sitw-cuenta .sitw-coins-balance .sitw-perfil-saldo-num {
    margin: 0 0 7px;
    font-size: clamp(42px,7vw,66px);
    letter-spacing: -.05em;
}

body.sitw-cuenta .sitw-coins-summary {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    border-bottom: 1px solid var(--pf-line);
}
body.sitw-cuenta .sitw-coins-summary > div { padding: 21px 24px; border-right: 1px solid var(--pf-line); }
body.sitw-cuenta .sitw-coins-summary > div:last-child { border-right: 0; }
body.sitw-cuenta .sitw-coins-summary span { display: block; color: rgba(245,242,250,.42); font-size: 11px; }
body.sitw-cuenta .sitw-coins-summary strong { display: block; margin-top: 7px; color: #fff; font: 600 18px/1 var(--ct-mono); }

body.sitw-cuenta .sitw-coins-withdraw { margin: 26px 30px; padding: 23px; border: 1px solid rgba(177,91,255,.25); border-radius: 17px; background: rgba(163,71,255,.055); }
body.sitw-cuenta .sitw-coins-withdraw-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; }
body.sitw-cuenta .sitw-coins-withdraw-head span { color: rgba(245,242,250,.48); font-size: 11px; }
body.sitw-cuenta .sitw-coins-withdraw-head strong { display: block; margin-top: 5px; color: #fff; font-size: 15px; }
body.sitw-cuenta .sitw-coins-progress { height: 8px; margin: 17px 0 13px; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.08); }
body.sitw-cuenta .sitw-coins-progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#7b2fff,#c86cff); box-shadow: 0 0 20px rgba(178,81,255,.5); }
body.sitw-cuenta .sitw-coins-withdraw p { margin: 0 0 17px; color: var(--pf-muted); font-size: 12.5px; line-height: 1.55; }
body.sitw-cuenta .sitw-coins-withdraw button[disabled] { opacity: .4; cursor: not-allowed; }

body.sitw-cuenta .sitw-coins-how { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin: 0 30px 26px; overflow: hidden; border: 1px solid var(--pf-line); border-radius: 17px; background: var(--pf-line); }
body.sitw-cuenta .sitw-coins-how article { padding: 22px; background: #0d0d12; }
body.sitw-cuenta .sitw-coins-how article > span { color: var(--pf-purple-soft); font: 700 11px var(--ct-mono); }
body.sitw-cuenta .sitw-coins-how strong { display: block; margin: 14px 0 7px; color: #fff; font-size: 13px; }
body.sitw-cuenta .sitw-coins-how p { margin: 0; color: rgba(245,242,250,.47); font-size: 11.5px; line-height: 1.6; }

body.sitw-cuenta .sitw-coins-details { margin: 0 30px 30px; padding-top: 21px; border-top: 1px solid var(--pf-line); }
body.sitw-cuenta .sitw-coins-details summary { cursor: pointer; color: rgba(245,242,250,.58); font-size: 12.5px; }
body.sitw-cuenta .sitw-coins-details .sitw-perfil-saldos { margin-top: 17px; }

@media (max-width: 900px) {
    body.sitw-cuenta .sitw-perfil-layout { grid-template-columns: 1fr; }
    body.sitw-cuenta .sitw-perfil-nav { position: static; flex-direction: row; margin: 0; padding: 9px; overflow-x: auto; }
    body.sitw-cuenta .sitw-perfil-nav-item { flex: none; min-width: 126px; }
    body.sitw-cuenta .sitw-perfil-library-course { grid-template-columns: minmax(0,1fr) 140px; }
    body.sitw-cuenta .sitw-perfil-library-course .sitw-btn-sm { grid-column: 1 / -1; justify-self: start; }
}

@media (max-width: 700px) {
    body.sitw-cuenta .sitw-perfil-wrap { width: min(100% - 28px, 1180px); padding-top: 18px; }
    body.sitw-cuenta .sitw-perfil-header { border-radius: 22px; }
    body.sitw-cuenta .sitw-perfil-cover { height: 140px; }
    body.sitw-cuenta .sitw-perfil-cover span { left: 20px; top: 22px; }
    body.sitw-cuenta .sitw-perfil-header-inner { display: block; margin-top: -48px; padding: 0 20px 24px; }
    body.sitw-cuenta .sitw-perfil-avatar { width: 96px; height: 96px; border-width: 4px; }
    body.sitw-cuenta .sitw-perfil-identity { padding-top: 14px; }
    body.sitw-cuenta .sitw-perfil-name-row { justify-content: flex-start; }
    body.sitw-cuenta .sitw-perfil-public-btn { display: inline-block; margin-top: 17px; }
    body.sitw-cuenta .sitw-perfil-stats { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 12px; margin-top: 22px; }
    body.sitw-cuenta .sitw-perfil-card { padding: 22px 18px; }
    body.sitw-cuenta .sitw-coins-card { padding: 0; }
    body.sitw-cuenta .sitw-perfil-library-course { grid-template-columns: 1fr; gap: 15px; }
    body.sitw-cuenta .sitw-perfil-library-course .sitw-btn-sm { grid-column: auto; }
    body.sitw-cuenta .sitw-coins-balance { gap: 16px; padding: 25px 20px; }
    body.sitw-cuenta .sitw-coins-balance img { width: 78px; height: 78px; }
    body.sitw-cuenta .sitw-coins-summary { grid-template-columns: 1fr; }
    body.sitw-cuenta .sitw-coins-summary > div { padding: 17px 20px; border-right: 0; border-bottom: 1px solid var(--pf-line); }
    body.sitw-cuenta .sitw-coins-summary > div:last-child { border-bottom: 0; }
    body.sitw-cuenta .sitw-coins-withdraw { margin: 20px; padding: 19px; }
    body.sitw-cuenta .sitw-coins-withdraw-head { align-items: flex-start; }
    body.sitw-cuenta .sitw-coins-how { grid-template-columns: 1fr; margin: 0 20px 22px; }
    body.sitw-cuenta .sitw-coins-details { margin: 0 20px 24px; }
}

/* ── Solicitudes y proyectos por entidad ─────────────────────────────── */
body.sitw-cuenta .sitw-project-list-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    background:
        radial-gradient(420px 180px at 100% 0, rgba(163,71,255,.13), transparent 70%),
        var(--pf-surface);
}
body.sitw-cuenta .sitw-project-list-head .sitw-perfil-card-title { margin-bottom: 12px; }
body.sitw-cuenta .sitw-project-list-head h2 { margin: 0 0 8px; color: #fff; font-size: 23px; letter-spacing: -.025em; }
body.sitw-cuenta .sitw-project-list-head p:last-child { max-width: 570px; margin: 0; color: var(--pf-muted); font-size: 12.5px; line-height: 1.6; }
body.sitw-cuenta .sitw-project-list-head .sitw-btn-sm { flex: none; color: #fff; text-decoration: none; }

body.sitw-cuenta .sitw-project-list {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px;
}
body.sitw-cuenta .sitw-project-list-item {
    min-width: 0;
    padding: 24px;
    border: 1px solid var(--pf-line);
    border-radius: 18px;
    background: var(--pf-surface);
    transition: border-color .2s, transform .2s;
}
body.sitw-cuenta .sitw-project-list-item:hover { border-color: rgba(176,91,255,.34); transform: translateY(-2px); }
body.sitw-cuenta .sitw-project-list-meta { display: flex; justify-content: space-between; gap: 15px; color: rgba(245,242,250,.32); font: 600 9px/1 var(--ct-mono); letter-spacing: .1em; }
body.sitw-cuenta .sitw-project-list-item h3 { margin: 26px 0 9px; color: #fff; font-size: 19px; letter-spacing: -.02em; }
body.sitw-cuenta .sitw-project-list-item > p { min-height: 58px; margin: 0; color: var(--pf-muted); font-size: 12px; line-height: 1.6; }
body.sitw-cuenta .sitw-project-list-item > div:last-child { display: flex; justify-content: space-between; gap: 15px; align-items: center; margin-top: 22px; padding-top: 17px; border-top: 1px solid var(--pf-line); }
body.sitw-cuenta .sitw-project-list-item a,
body.sitw-cuenta .sitw-project-backrow a { color: #d6b4f6; font-size: 11px; text-decoration: none; }

body.sitw-cuenta .sitw-project-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 9px;
    border: 1px solid rgba(140,236,255,.22);
    border-radius: 99px;
    color: #aeeefa;
    background: rgba(88,205,226,.055);
    font: 700 8px/1 var(--ct-mono);
    letter-spacing: .08em;
    text-transform: uppercase;
}
body.sitw-cuenta .sitw-project-status::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; box-shadow: 0 0 9px currentColor; }
body.sitw-cuenta .sitw-project-status.is-waiting { border-color: rgba(255,193,101,.23); color: #ffc165; background: rgba(255,193,101,.05); }
body.sitw-cuenta .sitw-project-status.is-success { border-color: rgba(116,234,165,.25); color: #83e9a9; background: rgba(74,190,118,.06); }
body.sitw-cuenta .sitw-project-status.is-closed { border-color: rgba(255,255,255,.13); color: rgba(245,242,250,.42); background: rgba(255,255,255,.025); }

body.sitw-cuenta .sitw-project-backrow { display: flex; justify-content: space-between; gap: 20px; padding: 0 3px; }
body.sitw-cuenta .sitw-project-hero-card { display: flex; justify-content: space-between; gap: 30px; align-items: flex-start; border-top-color: rgba(176,91,255,.48); background: radial-gradient(480px 220px at 0 0, rgba(163,71,255,.13), transparent 70%),var(--pf-surface); }
body.sitw-cuenta .sitw-project-code { color: var(--pf-purple-soft); font: 700 9px/1 var(--ct-mono); letter-spacing: .14em; }
body.sitw-cuenta .sitw-project-hero-card h2 { margin: 12px 0 9px; color: #fff; font-size: 28px; letter-spacing: -.035em; }
body.sitw-cuenta .sitw-project-hero-card p { max-width: 590px; margin: 0; color: var(--pf-muted); font-size: 13px; line-height: 1.65; }
body.sitw-cuenta .sitw-project-hero-actions { display: grid; justify-items: end; gap: 11px; flex: none; }
body.sitw-cuenta .sitw-project-hero-actions > a { color: #d6b4f6; font-size: 10px; text-decoration: none; }

body.sitw-cuenta .sitw-project-fact-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--pf-line); border-radius: 14px; background: var(--pf-line); }
body.sitw-cuenta .sitw-project-fact-grid > div { min-width: 0; padding: 17px; background: var(--pf-surface-2); }
body.sitw-cuenta .sitw-project-fact-grid span,
body.sitw-cuenta .sitw-project-description > span { display: block; margin-bottom: 7px; color: rgba(245,242,250,.34); font: 600 8px/1 var(--ct-mono); letter-spacing: .12em; text-transform: uppercase; }
body.sitw-cuenta .sitw-project-fact-grid strong { color: rgba(245,242,250,.82); font-size: 12px; font-weight: 600; line-height: 1.45; }
body.sitw-cuenta .sitw-project-description { margin-top: 20px; padding: 20px; border-left: 2px solid rgba(176,91,255,.48); background: rgba(255,255,255,.025); }
body.sitw-cuenta .sitw-project-description p { margin: 0; color: rgba(245,242,250,.68); font-size: 12.5px; line-height: 1.7; }

body.sitw-cuenta .sitw-project-history { margin: 0; padding: 0; list-style: none; }
body.sitw-cuenta .sitw-project-history li { position: relative; display: grid; grid-template-columns: 13px 1fr; gap: 13px; padding-bottom: 21px; }
body.sitw-cuenta .sitw-project-history li:last-child { padding-bottom: 0; }
body.sitw-cuenta .sitw-project-history li::before { content: ""; position: absolute; top: 11px; bottom: -1px; left: 5px; width: 1px; background: var(--pf-line); }
body.sitw-cuenta .sitw-project-history li:last-child::before { display: none; }
body.sitw-cuenta .sitw-project-history i { position: relative; z-index: 1; width: 11px; height: 11px; margin-top: 2px; border: 2px solid #17161d; border-radius: 50%; background: rgba(245,242,250,.32); box-shadow: 0 0 0 1px rgba(245,242,250,.18); }
body.sitw-cuenta .sitw-project-history li.is-current i { background: var(--pf-purple-soft); box-shadow: 0 0 14px rgba(176,91,255,.62); }
body.sitw-cuenta .sitw-project-history strong { display: block; color: rgba(245,242,250,.76); font-size: 12.5px; }
body.sitw-cuenta .sitw-project-history time { display: block; margin-top: 4px; color: rgba(245,242,250,.3); font: 500 9px/1.3 var(--ct-mono); }

@media (max-width: 700px) {
    body.sitw-cuenta .sitw-project-list-head,
    body.sitw-cuenta .sitw-project-hero-card { display: block; }
    body.sitw-cuenta .sitw-project-list-head .sitw-btn-sm,
    body.sitw-cuenta .sitw-project-hero-actions { justify-items: start; margin-top: 20px; }
    body.sitw-cuenta .sitw-project-hero-card .sitw-project-status { display: inline-flex; }
    body.sitw-cuenta .sitw-project-list { grid-template-columns: 1fr; }
    body.sitw-cuenta .sitw-project-fact-grid { grid-template-columns: 1fr; }
    body.sitw-cuenta .sitw-project-list-item > p { min-height: 0; }
}