/* RolePlay: identidad propia, expediente municipal de Los Santos.
   Se carga junto a profile.css (header, footer y botones compartidos);
   aqui solo se redefine el color de acento y se anade el contenido propio. */

:root {
    --rp-bg: #121110;
    --rp-panel: #1B1917;
    --rp-paper: #D9D0BE;
    --rp-accent: #C99A3E;
    --rp-accent-dim: rgba(201, 154, 62, .16);
    --rp-danger: #8C2F2F;
    --rp-text: #E9E4D6;
    --rp-muted: rgba(233, 228, 214, .52);
    --rp-line: rgba(233, 228, 214, .12);

    /* header/footer/botones compartidos (profile.css) usan --neon-cyan */
    --neon-cyan: var(--rp-accent);
    --neon-cyan-glow: rgba(201, 154, 62, .45);
    --neon-cyan-dim: var(--rp-accent-dim);
}

body { background: var(--rp-bg); color: var(--rp-text); }

.rp-hero {
    max-width: 720px;
    padding: 56px 0 40px;
    border-bottom: 1px solid var(--rp-line);
    margin-bottom: 40px;
}

.rp-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Inconsolata', monospace;
    font-size: .78rem;
    letter-spacing: .04em;
    color: var(--rp-accent);
    border: 1px solid var(--rp-accent-dim);
    background: var(--rp-accent-dim);
    padding: 5px 12px;
    border-radius: 3px;
}
.rp-kicker .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--rp-accent); }

.rp-title {
    font-family: 'Archivo Black', sans-serif;
    font-size: 4rem;
    line-height: .95;
    letter-spacing: -1px;
    color: var(--rp-paper);
    margin: 22px 0 4px;
    text-shadow: 2px 2px 0 rgba(0,0,0,.4);
}
.rp-title .place { display: block; font-size: 1.4rem; letter-spacing: 3px; color: var(--rp-accent); margin-bottom: 6px; font-family: 'Inconsolata', monospace; font-weight: 400; }

.rp-lede {
    font-size: 1.08rem;
    line-height: 1.65;
    color: var(--rp-muted);
    max-width: 56ch;
    margin: 18px 0 30px;
}

.rp-actions { display: flex; gap: 14px; flex-wrap: wrap; }
.rp-btn {
    display: inline-block;
    padding: 13px 26px;
    border-radius: 3px;
    font-weight: 700;
    font-size: .92rem;
    text-decoration: none;
    transition: background .15s ease, color .15s ease;
}
.rp-btn-primary { background: var(--rp-accent); color: #1B1400; }
.rp-btn-primary:hover { background: #e0b45c; }
.rp-btn-ghost { border: 1px solid var(--rp-line); color: var(--rp-text); }
.rp-btn-ghost:hover { border-color: var(--rp-accent); color: var(--rp-accent); }

/* -- Registro de incidentes (ficticio, decorativo pero con vocación real) -- */
.rp-log { margin-bottom: 48px; }
.rp-log-head {
    font-family: 'Inconsolata', monospace;
    font-size: .75rem;
    color: var(--rp-muted);
    letter-spacing: .03em;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--rp-line);
}
.rp-log-item {
    display: grid;
    grid-template-columns: 90px 1fr auto;
    gap: 16px;
    padding: 13px 0;
    border-bottom: 1px solid var(--rp-line);
    font-size: .88rem;
    align-items: baseline;
}
.rp-log-item:last-child { border-bottom: none; }
.rp-log-time { font-family: 'Inconsolata', monospace; color: var(--rp-muted); font-size: .78rem; }
.rp-log-desc { color: var(--rp-text); }
.rp-log-status { font-family: 'Inconsolata', monospace; font-size: .72rem; padding: 2px 8px; border-radius: 3px; white-space: nowrap; }
.rp-log-status.abierto  { color: var(--rp-danger); border: 1px solid var(--rp-danger); }
.rp-log-status.resuelto { color: var(--rp-muted); border: 1px solid var(--rp-line); }

/* -- Cómo empezar (secuencia real, numerada con motivo) -- */
.rp-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 48px; }
.rp-step { border-left: 2px solid var(--rp-accent); padding-left: 18px; }
.rp-step-n { font-family: 'Inconsolata', monospace; color: var(--rp-accent); font-size: .8rem; }
.rp-step-t { font-weight: 700; color: var(--rp-paper); margin: 6px 0 4px; font-size: 1.02rem; }
.rp-step-d { color: var(--rp-muted); font-size: .85rem; line-height: 1.5; }

/* -- Secciones / accesos -- */
.rp-section-head { font-family: 'Inconsolata', monospace; font-size: .75rem; color: var(--rp-muted); letter-spacing: .03em; margin: 8px 0 16px; }
.rp-folders { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-bottom: 48px; }
.rp-folder {
    display: block;
    text-decoration: none;
    background: var(--rp-panel);
    border: 1px solid var(--rp-line);
    border-left: 3px solid var(--rp-accent);
    padding: 20px 20px 18px;
    border-radius: 4px;
    transition: border-color .15s ease, transform .15s ease;
}
.rp-folder:hover { border-left-color: #e0b45c; transform: translateX(2px); }
.rp-folder-title { color: var(--rp-paper); font-weight: 700; font-size: 1rem; margin-bottom: 6px; }
.rp-folder-desc { color: var(--rp-muted); font-size: .84rem; line-height: 1.5; }

@media (max-width: 860px) {
    .rp-title { font-size: 2.8rem; }
    .rp-steps { grid-template-columns: 1fr; }
    .rp-log-item { grid-template-columns: 1fr; gap: 4px; }
}