/* Ficha como página propia (tarea 12): volver, cabecera con todas las acciones, bloque «En tu
   campaña», pestañas y, a la derecha, el calendario y las fichas cercanas. */

.record-page{max-width:1180px;margin:0 auto}
.record-top{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-bottom:20px}
.record-top .button svg,.detail-back svg{transform:rotate(180deg)}
.record-crumb{font-size:14px;color:#a9b4be}
.record-crumb span{color:var(--ink)}
.detail-content{display:flex;flex-direction:column;gap:24px}

/* Cabecera */
.record-header{display:flex;flex-wrap:wrap;gap:28px;align-items:flex-start}
.record-header .detail-art{flex:0 0 240px;margin:0}
.record-header .detail-art button{position:relative;display:block;width:100%;padding:0;border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.record-header .detail-art img,.detail-content:has(.profile-tabs) .record-header .detail-art.portrait img{display:block;width:100%;height:auto;max-height:320px;aspect-ratio:3/4;object-fit:cover;object-position:50% 20%}
.record-header .detail-art:not(.portrait) img{aspect-ratio:4/3}
.record-header .detail-art button>span{position:absolute;right:8px;bottom:8px;padding:4px 10px;border-radius:6px;background:#0c121acc;color:var(--ink);font-size:13px}
.record-header .detail-art figcaption{margin-top:6px;font-size:12px;line-height:1.5;color:#a9b4be}
.record-heading{flex:1 1 480px;min-width:0;display:flex;flex-direction:column;gap:10px}
.profile-header-role{margin:0;font-family:var(--font-label);font-size:13px;letter-spacing:.08em;text-transform:lowercase;color:var(--gold-soft)}
.record-heading h1{margin:0;font-family:var(--font-serif);font-weight:500;font-size:46px;line-height:1.05;color:#f1e7cf;outline:0}
.detail-year{font-size:18px;color:var(--gold-soft)}
.profile-milestone{margin:0;font-size:14px;color:#a9b4be}
.detail-badges{display:flex;flex-wrap:wrap;gap:8px}
.detail-badges span{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:6px;background:#253446;font-size:14px;color:var(--ink)}
.detail-badges .badge-type{font-weight:700;background:color-mix(in srgb,var(--type-color) 25%,transparent);color:color-mix(in srgb,var(--type-color) 60%,white)}
.detail-badges .badge-custom{background:var(--gold-soft);color:var(--side);font-weight:700}
.detail-summary{margin:0;font-family:var(--font-serif);font-size:19px;line-height:1.55;color:#d9d0bb}
.record-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:4px}
.record-actions svg{width:18px;height:18px}

/* En tu campaña: lo propio, antes que el canon. */
.record-campaign{border:1px solid #e2a23b66;background:#e2a23b0d;border-radius:14px;padding:18px 22px}
.record-campaign>h2{margin:0 0 12px;font-family:var(--font-serif);font-weight:500;font-size:21px;color:var(--gold-soft)}
.campaign-cells{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px 24px}
.campaign-cell{min-width:0}
.campaign-cell .section-caption{margin:0 0 8px;font-size:12px;color:#a9b4be}
.campaign-cell .npc-status{margin:0;padding:0;border:0;background:none}
.campaign-empty{margin:0;font-size:14px;color:var(--muted)}
.campaign-cell .related-list{display:flex;flex-wrap:wrap;gap:6px}
.campaign-cell .related-btn{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 12px;border:0;border-radius:999px;background:#253446;color:var(--ink);font-size:14px;width:auto}
.campaign-cell .related-btn span{font-size:12px;color:var(--gold-soft)}
.campaign-notes{grid-column:span 1}
.personal-note{width:100%;min-height:96px;box-sizing:border-box;background:var(--bg);border:1px solid #3a4a5e;border-radius:8px;color:var(--ink);font:15px/1.5 var(--font-ui);padding:10px;resize:vertical}
.note-label,.note-status{display:block;font-size:13px;color:var(--muted);margin:4px 0}
.record-campaign .divergence-notice{margin:0 0 14px}

/* Cuerpo: pestañas y contenido a la izquierda; calendario y fichas cercanas a la derecha. */
.record-body{display:flex;flex-wrap:wrap;gap:40px;align-items:flex-start}
.record-main{flex:999 1 560px;min-width:0;font-size:16px;line-height:1.65;color:#d9d0bb}
.record-main p{font-size:16px}
.record-aside{flex:1 1 260px;max-width:340px;display:flex;flex-direction:column;gap:6px}
.record-aside .section-caption{margin:18px 0 6px}
.record-aside .related-list{display:flex;flex-direction:column}
.record-aside .related-btn{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:44px;font-size:15px}
.record-aside .related-btn span{font-size:13px;color:var(--muted)}
.profile-tabs{position:sticky;top:110px;z-index:5;background:var(--bg)}
.profile-tabs button{min-height:48px;font-size:16px}
.record-main .section-caption{font-size:12px}
.people-tags{display:flex;flex-wrap:wrap;gap:6px}
.people-tag{min-height:40px;font-size:14px}
.source-item a{font-size:15px}
.spoiler-toggle{display:flex;align-items:center;gap:10px;min-height:44px;font-size:15px}

@media(max-width:760px){
 .record-top{margin-bottom:14px}
 .record-crumb{display:none}
 /* Retrato chico al lado del nombre; el resumen y las acciones ocupan todo el ancho debajo. */
 .record-header{display:grid;grid-template-columns:104px minmax(0,1fr);gap:8px 14px;align-items:start}
 .record-header .detail-art{grid-row:1/span 4;grid-column:1}
 .record-heading{display:contents}
 .record-heading>*{grid-column:2}
 .record-heading>.detail-badges,.record-heading>.detail-summary,.record-heading>.record-actions,.record-heading>.text-btn,.record-heading>.profile-milestone,.record-heading>.calendar-panel{grid-column:1/-1}
 .record-header .detail-art img,.detail-content:has(.profile-tabs) .record-header .detail-art.portrait img{max-height:150px}
 .record-header .detail-art button>span,.record-header .detail-art figcaption{display:none}
 .record-heading h1{font-size:32px}
 .detail-summary{font-size:17px}
 .record-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .record-actions .button{padding:0 10px}
 .record-campaign{padding:14px 16px}
 .profile-tabs{top:0}
 .record-aside{max-width:none}
}