/* Copa Pipbuk!: puntos, temporadas y celebraciones. Lavanda como base; cada casa aporta su acento
   via --house / --house-tint (definidos en houses.css). Sin casa, se usa el lavanda de Pipbuk!. */
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.points-label { display: block; font-size: .65rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-bottom: .35rem; }

/* Resumen del lector (perfil y /points) */
.points-summary { --accent: var(--house, var(--violet-dark)); --accent-tint: var(--house-tint, var(--violet-tint));
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 1.5rem 0 2rem; border: 1px solid var(--line); border-radius: 20px; overflow: hidden; background: var(--line); }
.points-summary > * { background: #fff; padding: 1.25rem 1.4rem; min-width: 0; }
.points-summary-identity { grid-column: 1 / 3; display: flex; align-items: center; gap: 1rem; background: var(--accent-tint); position: relative; }
.points-summary-identity::after { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: var(--house-glow, linear-gradient(90deg, #784dfe, #bba6ff)); }
.points-crest { display: grid; place-items: center; width: 3.75rem; height: 3.75rem; flex-shrink: 0; border-radius: 18px; background: #fff; border: 1px solid var(--line); color: var(--accent); font-size: 1.5rem; }
.points-crest .house-icon { width: 2rem; height: 2rem; stroke-width: 1.4; }
.points-summary-identity h2 { margin: 0; font: 400 1.6rem/1.2 Georgia, serif; color: var(--ink); overflow-wrap: anywhere; }
.points-summary-house { display: inline-block; margin-top: .2rem; color: var(--accent); font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-decoration: none; }
.points-summary-stats { grid-column: 3 / 5; display: flex; gap: 1rem 2rem; flex-wrap: wrap; align-items: center; margin: 0; }
.points-summary-stats dt { font-size: .7rem; color: var(--muted); }
.points-summary-stats dd { margin: .1rem 0 0; font-size: 1.6rem; font-weight: 600; color: var(--ink); line-height: 1.2; }
.points-summary-total dd { color: var(--accent); font-size: 2.1rem; }
.points-summary-stats dd span { font-size: .75rem; font-weight: 500; color: var(--muted); }
.points-summary-season, .points-summary-next { grid-column: span 2; }
.points-summary-season p, .points-summary-next p { margin: 0; font-size: .88rem; }
.points-summary-season strong { color: var(--accent); }
.points-summary-season small { display: block; color: var(--muted); font-size: .72rem; margin-top: .35rem; }
.points-summary-next strong { display: block; color: var(--accent); margin-top: .2rem; }
.points-progress { display: block; height: 6px; margin-top: .7rem; border-radius: 999px; background: var(--accent-tint); overflow: hidden; }
.points-progress > span { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.points-summary-badges { grid-column: 1 / -1; }
.points-summary-badges ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .45rem; }
.points-summary-badges li { padding: .3rem .75rem; border-radius: 999px; background: var(--accent-tint); color: var(--accent); font-size: .75rem; font-weight: 500; }

/* Historial */
.points-recent { margin-bottom: 2.5rem; }
.points-recent-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; flex-wrap: wrap; }
.points-recent-heading h2 { margin: 0 0 .75rem; }
.points-recent-heading a, .house-points-link { color: var(--violet-dark); font-size: .8rem; text-decoration: none; }
.house-points-link { display: inline-block; margin-top: .6rem; }
.points-history { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.points-history li { display: flex; gap: 1.25rem; align-items: baseline; padding: .9rem 0; border-bottom: 1px solid var(--line); }
.points-history-amount { flex: 0 0 4.5rem; font-weight: 700; font-size: 1.05rem; color: var(--violet-dark); font-variant-numeric: tabular-nums; }
.points-history-amount.is-negative { color: var(--danger); }
.points-history p { margin: 0; font-size: .9rem; }
.points-history-bonus { display: block; color: var(--violet-dark); font-size: .75rem; }
.points-history time { display: block; color: var(--muted); font-size: .72rem; margin-top: .15rem; }
.points-muted { color: var(--muted); font-size: .8rem; }


/* Copa Pipbuk! */
.page-narrow.cup-page { max-width: 900px; }
body:has(.cup-page) {
    background-color: #fff;
    background-image: none;
}
.cup-page {
    background-color: #fffdf7;
    background-image: linear-gradient(#fffdf7b3, #fffdf7b3), url('../img/cup-gouache-pencil-scattered-pattern.png');
    background-position: 0 0, 23px 41px;
    background-size: auto, 540px 540px;
    background-repeat: repeat;
    border-radius: 20px;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}
.cup-page .cup-history > .empty-state { background: #fffcf4d9; border-radius: 16px; padding: 1.25rem; }
.cup-hero { text-align: center; padding: 1rem 0 2rem; }
.cup-trophy-illustration { display: block; width: clamp(130px, 18vw, 180px); height: auto; margin: 0 auto 1rem; object-fit: contain; }
.cup-trophy { width: 3.25rem; height: 3.25rem; color: var(--violet); margin: 0 auto .75rem; display: block; }
.cup-hero h1 { font: 400 clamp(1.9rem, 4.5vw, 2.8rem)/1.2 Georgia, serif; color: var(--ink); margin: .4rem 0 .5rem; letter-spacing: -.03em; }
.cup-remaining { color: var(--violet-dark); font-weight: 500; margin: 0; }
.cup-rule { color: var(--muted); font-size: .78rem; max-width: 460px; margin: .9rem auto 0; }
body:has(.cup-page) { position: relative; isolation: isolate; min-height: 100vh; }
.cup-page { position: static; isolation: auto; }
.cup-page > :not(.cup-enchantment) { position: relative; z-index: 1; }
.cup-enchantment { position: absolute; inset: 0; z-index: 2; pointer-events: none; overflow: hidden; }
.cup-firefly { position: absolute; left: var(--x); top: var(--y); width: var(--size); height: var(--size); color: var(--house); background: var(--house); border-radius: 50%; box-shadow: 0 0 6px 2px var(--house-light), 0 0 12px 2px var(--house-aura); opacity: .45; animation: cup-twinkle var(--duration) ease-in-out var(--delay) infinite alternate; }
.cup-firefly.is-star { width: 10px; height: 10px; border-radius: 0; clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%); }
.cup-firefly { animation: cup-twinkle var(--duration) ease-in-out var(--delay) infinite alternate, cup-float calc(var(--duration) * 2) ease-in-out var(--delay) infinite alternate; transform: translate(var(--cursor-x, 0px), var(--cursor-y, 0px)); transition: transform .65s ease-out; }
.cup-firefly:nth-child(even) { --float-x: -22px; --float-y: 18px; }
@keyframes cup-float { from { translate: 0 0; } to { translate: var(--float-x, 25px) var(--float-y, -28px); } }
.cup-row.is-leading { position: relative; isolation: isolate; overflow: hidden; border-color: var(--house); box-shadow: 0 0 14px color-mix(in srgb, var(--house-aura) 18%, transparent); }
.cup-row.is-leading > * { position: relative; z-index: 1; }
.cup-row.is-leading::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(110deg, transparent 30%, color-mix(in srgb, var(--house-aura) 35%, transparent) 46%, #ffffffb3 50%, transparent 65%); transform: translateX(-110%); animation: cup-leader-shine 8s ease-in-out -3s infinite; }
.cup-row.is-leading::after { content: "✧"; position: absolute; right: 1rem; top: .15rem; color: var(--house); font-size: .65rem; letter-spacing: .2rem; pointer-events: none; animation: cup-twinkle 3s ease-in-out infinite alternate; }
.cup-row.is-leading .cup-crest { box-shadow: 0 0 9px 1px var(--house-light); }
@keyframes cup-twinkle { from { opacity: .25; } to { opacity: .65; } }
@keyframes cup-leader-shine { 0%, 35% { transform: translateX(-110%); } 70%, 100% { transform: translateX(110%); } }
@media (max-width: 600px) { .cup-firefly:nth-child(n+13) { display: none; } }
@media (prefers-reduced-motion: reduce) { .cup-firefly, .cup-row.is-leading::before, .cup-row.is-leading::after { animation: none; } .cup-row.is-leading::before { transform: none; opacity: .25; } }
.cup-ranking { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.cup-row { display: flex; align-items: center; gap: 1rem; padding: 1rem 1.25rem; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.cup-row.is-current { background: var(--house-tint); border-color: var(--house); }
.cup-row:first-child { box-shadow: 0 10px 30px #32245a0d; }
.cup-position { flex: 0 0 2rem; font: 400 1.4rem Georgia, serif; color: var(--muted); }
.cup-row:first-child .cup-position { color: var(--house); }
.cup-crest { display: grid; place-items: center; width: 3rem; height: 3rem; flex-shrink: 0; border-radius: 14px; background: var(--house-tint, var(--violet-tint)); color: var(--house, var(--violet-dark)); }
.is-current .cup-crest { background: #fff; }
.cup-crest svg { width: 1.6rem; height: 1.6rem; }
.cup-house { flex: 1; min-width: 0; }
.cup-house strong { display: block; font: 400 1.35rem/1.2 Georgia, serif; color: var(--house); }
.cup-house > span:not(.cup-bar) { font-size: .75rem; color: var(--muted); }
.cup-bar { display: block; height: 5px; margin-top: .55rem; border-radius: 999px; background: #f0edf7; overflow: hidden; }
.cup-bar > span { display: block; height: 100%; border-radius: inherit; background: var(--house-glow); }
.house-aeria .cup-bar > span { background: linear-gradient(90deg, #5b3fb0, #9674d5); }
.cup-points { font-size: 1.35rem; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cup-points small { font-size: .7rem; font-weight: 500; color: var(--muted); }
.cup-contribution { text-align: center; font-size: .85rem; color: var(--muted); margin: 1.25rem 0 0; }
.cup-contribution a { color: var(--violet-dark); }
.cup-history { margin-top: 3rem; }
.cup-history-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.cup-history-item { padding: 1rem 1.25rem; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.cup-history-winner { display: flex; gap: .9rem; align-items: center; }
.cup-history-winner strong { display: block; }
.cup-history-winner span { font-size: .75rem; color: var(--muted); }
.cup-history-winner .cup-trophy { width: 1.6rem; height: 1.6rem; margin: 0; }
.cup-history-standings { list-style: none; margin: .9rem 0 0; padding: .8rem 0 0; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; font-size: .8rem; }
.cup-history-standings li { display: flex; align-items: center; gap: .35rem; color: var(--house); }
.cup-history-standings .house-icon { width: 1rem; height: 1rem; }
.cup-history-standings span { color: var(--muted); }

/* Celebracion al verificar una resena */
.celebration { --accent: var(--house, var(--violet-dark)); --accent-tint: var(--house-tint, var(--violet-tint));
    width: min(440px, calc(100% - 2rem)); max-height: calc(100% - 2rem); padding: 0; border: 0; border-radius: 24px; background: #fff; color: var(--ink); box-shadow: 0 30px 80px #24174740; overflow: auto; }
.celebration::backdrop { background: #1d1533a6; backdrop-filter: blur(3px); }
.celebration-card { --accent: var(--house, var(--violet-dark)); --accent-tint: var(--house-tint, var(--violet-tint));
    position: relative; text-align: center; padding: 2.25rem 1.75rem 1.25rem; background: linear-gradient(180deg, var(--accent-tint), #fff 70%); }
.celebration-card + .celebration-card { border-top: 1px solid var(--line); }
.celebration-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 5px; background: var(--house-glow, linear-gradient(90deg, #784dfe, #bba6ff)); }
.celebration-emblem { display: inline-grid; place-items: center; width: 4.25rem; height: 4.25rem; border-radius: 50%; background: #fff; border: 1px solid var(--line); color: var(--accent); font-size: 1.6rem; box-shadow: 0 8px 24px #32245a12; }
.celebration-emblem .house-icon { width: 2.3rem; height: 2.3rem; stroke-width: 1.4; }
.celebration-points { margin: 1rem 0 .1rem; font: 700 2.6rem/1 "Poppins", sans-serif; letter-spacing: -.04em; color: var(--accent); }
.celebration-points span { font-size: .8rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.celebration-card h2 { margin: .4rem 0 .2rem; font: 400 1.45rem/1.3 Georgia, serif; color: var(--ink); }
.celebration-book { margin: 0; font-size: .82rem; color: var(--muted); }
.celebration-breakdown, .celebration-totals { margin: 1.1rem auto 0; max-width: 300px; text-align: left; font-size: .85rem; }
.celebration-breakdown div, .celebration-totals div { display: flex; justify-content: space-between; gap: 1rem; padding: .35rem 0; border-bottom: 1px dashed var(--line); }
.celebration-breakdown dd, .celebration-totals dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.celebration-totals dt { color: var(--muted); }
.celebration-house { display: inline-block; margin: 1rem 0 0; padding: .35rem .9rem; border-radius: 999px; background: var(--accent); color: #fff; font-size: .8rem; font-weight: 600; }
.celebration-next { margin: 1rem 0 0; font-size: .82rem; color: var(--ink); }
.celebration-next span:last-child { color: var(--muted); }
.celebration-next a { color: var(--accent); }
.celebration-actions { padding: 1rem 1.75rem 1.6rem; text-align: center; }
.celebration-actions .btn-primary { width: 100%; border: 0; cursor: pointer; padding: .8rem 1rem; font: inherit; font-weight: 600; }
@media (prefers-reduced-motion: no-preference) {
    .celebration[open] { animation: celebration-in .45s cubic-bezier(.2, .8, .2, 1); }
    .celebration[open] .celebration-emblem { animation: celebration-emblem .8s .15s cubic-bezier(.2, .8, .2, 1) both; }
    .celebration[open] .celebration-points { animation: celebration-rise .6s .25s ease both; }
}
@keyframes celebration-in { from { opacity: 0; transform: translateY(12px) scale(.97); } }
@keyframes celebration-emblem { from { opacity: 0; transform: scale(.6) rotate(-12deg); } }
@keyframes celebration-rise { from { opacity: 0; transform: translateY(8px); } }

/* Administracion */
.admin-points-nav { display: flex; flex-wrap: wrap; gap: .4rem; margin: -1rem 0 1.5rem; }
.admin-points-nav a { padding: .45rem .9rem; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); font-size: .82rem; text-decoration: none; }
.admin-points-nav a[aria-current="page"], .admin-points-nav a:hover { background: var(--violet-tint); border-color: #d0bfff; color: var(--violet-dark); }
.admin-points-section { margin-bottom: 2.5rem; }
.admin-points-section h2 { margin-bottom: .35rem; }
.admin-points-help { color: var(--muted); font-size: .8rem; max-width: 720px; margin: 0 0 1rem; }
.admin-seasons { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .75rem; }
.admin-season { padding: 1rem 1.2rem; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.admin-season.is-active { border-color: var(--violet); box-shadow: inset 4px 0 0 var(--violet); }
.admin-season-head { display: flex; align-items: center; gap: .75rem 1rem; flex-wrap: wrap; }
.admin-season-head > div { flex: 1 1 240px; }
.admin-season-head strong { display: block; }
.admin-season-head span:not(.badge) { font-size: .78rem; color: var(--muted); }
.admin-season-head form { margin: 0; }
.admin-season-status { background: #eef0f4; color: var(--muted); }
.is-active .admin-season-status { background: var(--success-bg); color: var(--success); }
.is-upcoming .admin-season-status { background: var(--violet-tint); color: var(--violet-dark); }
.admin-season-standings { list-style: none; margin: .8rem 0 0; padding: .7rem 0 0; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; font-size: .82rem; }
.admin-season-standings li { display: flex; align-items: center; gap: .35rem; color: var(--house); }
.admin-season-standings .house-icon { width: 1rem; height: 1rem; }
.admin-season-standings a { color: var(--ink); font-weight: 600; }
.admin-season-position { color: var(--muted); }
.admin-inline-form { padding: 1rem 1.2rem; border: 1px dashed #d0bfff; border-radius: 14px; background: #fcfbff; }
.admin-inline-form h3 { margin: 0; font-size: .95rem; }
.admin-inline-fields { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem 1rem; }
.form .admin-inline-fields label { display: flex; flex-direction: column; gap: .3rem; margin: 0; font-size: .78rem; flex: 1 1 150px; }
.form .admin-inline-fields label.admin-adjust-reason { flex: 3 1 260px; }
.form .admin-inline-fields label.admin-checkbox { flex-direction: row; align-items: center; flex: 1 1 100%; font-weight: 400; }
.form .admin-inline-fields .admin-checkbox input { width: auto; min-height: 0; }
.admin-inline-fields button { flex: 0 0 auto; }
.admin-milestones { display: grid; gap: .5rem; margin-bottom: 1rem; }
.admin-milestone { display: grid; grid-template-columns: 4.5rem minmax(0, 2fr) minmax(0, 1fr) 3.5rem 6rem auto; gap: .75rem; align-items: center; padding: .6rem .9rem; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.admin-milestone-head { border: 0; background: none; padding-block: 0; font-size: .7rem; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; }
.admin-milestone strong { font-size: 1.1rem; color: var(--violet-dark); }
.admin-milestone input[type="text"], .admin-milestone input[type="number"] { width: 100%; min-width: 0; padding: .45rem .6rem; border: 1px solid #ddd5f0; border-radius: 8px; font: inherit; font-size: .85rem; }
.admin-milestone input[type="checkbox"] { justify-self: start; width: 1.1rem; height: 1.1rem; }
.admin-milestone > span { font-size: .78rem; color: var(--muted); }
.points-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.points-table { width: 100%; border-collapse: collapse; font-size: .84rem; }
.points-table th { text-align: left; font-size: .68rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); padding: .8rem 1rem; border-bottom: 1px solid var(--line); white-space: nowrap; }
.points-table td { padding: .75rem 1rem; border-bottom: 1px solid var(--line); vertical-align: top; }
.points-table tr:last-child td { border-bottom: 0; }
.points-table td small { display: block; color: var(--muted); font-size: .72rem; margin-top: .15rem; }
.points-table td .house-badge + small { margin-top: .3rem; }
.points-table .is-number { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.points-table a { color: var(--violet-dark); }
.admin-adjust { margin-bottom: 1.5rem; }
.admin-adjust-user { display: flex; align-items: baseline; flex-wrap: wrap; gap: .5rem 1rem; margin-bottom: .75rem; }
.admin-adjust-user h2 { margin: 0; }
.admin-adjust-user span { display: inline-flex; align-items: center; gap: .6rem; font-size: .85rem; color: var(--muted); }
.admin-user-points { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1.5rem; margin: 1rem 0 1.5rem; padding: .9rem 1.2rem; border: 1px solid var(--line); border-radius: 14px; background: #fcfbff; }
.admin-user-points p { margin: 0; font-size: .88rem; }
.admin-user-points a { color: var(--violet-dark); }
.admin-user-house { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; margin: 0; }
.admin-user-house label { font-size: .8rem; color: var(--muted); }
.admin-user-house select { padding: .45rem .6rem; border: 1px solid #ddd5f0; border-radius: 8px; font: inherit; font-size: .85rem; background: #fff; }

@media (max-width: 760px) {
    .points-summary { grid-template-columns: minmax(0, 1fr); }
    .points-summary > * { grid-column: auto; }
    .admin-milestone { grid-template-columns: 3.5rem minmax(0, 1fr) 5.5rem; }
    .admin-milestone-head { display: none; }
    .admin-milestone > span { grid-column: 2; }
}
@media (max-width: 540px) {
    .cup-ranking .cup-row {
        display: grid;
        grid-template-columns: 1.25rem 2.25rem minmax(0, 1fr) auto;
        gap: .25rem .6rem;
        padding: 1rem .85rem;
        border-radius: 14px;
    }
    .cup-ranking .cup-position { grid-column: 1; grid-row: 1 / 3; font-size: 1.1rem; align-self: center; }
    .cup-ranking .cup-crest { grid-column: 2; grid-row: 1 / 3; width: 2.25rem; height: 2.25rem; border-radius: 11px; }
    .cup-ranking .cup-crest svg { width: 1.3rem; height: 1.3rem; }
    .cup-ranking .cup-house { display: contents; }
    .cup-ranking .cup-house strong { grid-column: 3; grid-row: 1; font-size: 1.2rem; align-self: center; }
    .cup-ranking .cup-house > span:not(.cup-bar) { grid-column: 3 / -1; grid-row: 2; font-size: .68rem; line-height: 1.4; }
    .cup-ranking .cup-points { grid-column: 4; grid-row: 1; margin: 0; font-size: 1.15rem; text-align: right; align-self: center; }
    .cup-ranking .cup-points small { font-size: .6rem; font-weight: 400; }
    .cup-ranking .cup-bar { grid-column: 2 / -1; grid-row: 3; height: 4px; margin-top: .65rem; }
    .points-history-amount { flex-basis: 3.75rem; }
}

/* Campañas destacadas: sus reseñas valen mas puntos */
.badge-featured { background: #fff4d6; color: #8a5a00; }
.badge-points { background: var(--violet-tint); color: var(--violet-dark); }

/* Historial completo en el perfil: los últimos 5 a la vista, el resto desplegable. */
.points-history-more { margin-top: .25rem; }
.points-history-more summary { display: inline-block; margin: .9rem 0 .4rem; color: var(--violet-dark); font-size: .85rem; font-weight: 500; cursor: pointer; }
.points-history-more summary:hover { text-decoration: underline; }
.points-history-more[open] summary { margin-bottom: .6rem; }
.points-history-more .points-history { border-top: 0; }
