/* v2.49.0 · Sistema panorámico común
 * Amplía la superficie útil en escritorio sin alargar los bloques de lectura.
 * Se carga después de los estilos de módulo para actuar como capa de integración.
 */
:root{
  --site-gutter:clamp(16px,2.7vw,52px);
  --site-wide:1760px;
  --reading-width:980px;
  --form-width:1180px;
}

.container,
.header-inner{
  width:min(var(--site-wide),calc(100% - (var(--site-gutter) * 2)));
}

/* La búsqueda se alinea con el marco general y no queda flotando en el centro. */
.searchbar form{width:min(1120px,calc(100% - (var(--site-gutter) * 2)))}

/* Texto editorial: ancho cómodo aunque la pantalla sea panorámica. */
.content-page,
.comments,
.flag-tool{max-width:var(--reading-width)}
.content-page .lead,
.legacy-content>p,
.post-detail>p{max-width:78ch}

/* Formularios de cuenta/autenticación conservan una medida práctica. */
.form-card.narrow,
.auth-wrap{max-width:720px}
.form-card:not(.narrow){max-width:var(--form-width)}

/* Tablas y barras de filtros aprovechan el lienzo, sin provocar scroll exterior. */
.table-wrap,
.admin-filter,
.gallery-toolbar,
.gallery-toolbar-live,
.news-filters,
.pedia-filter{max-width:100%;min-width:0}
.table-wrap{overscroll-behavior-inline:contain}

@media (min-width:1440px){
  :root{--max:var(--site-wide)}

  main.container{padding-top:48px;padding-bottom:96px}
  .header-inner{min-height:88px;gap:clamp(20px,2vw,38px)}
  .brand{min-width:250px}
  .header-menu{min-width:0;flex:1}
  .main-nav{gap:clamp(10px,1vw,20px);justify-content:center}
  .main-nav a{font-size:clamp(.76rem,.67vw,.9rem);white-space:nowrap}
  .user-nav{justify-content:flex-end;white-space:nowrap}

  /* Listados editoriales y tarjetas genéricas. */
  .card-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
  .post-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .gallery-grid:not(.gallery-grid-dense),
  .gallery-grid.compact{grid-template-columns:repeat(6,minmax(0,1fr))}
  .gallery-grid.gallery-grid-dense{grid-template-columns:repeat(9,minmax(0,1fr))!important}
  .admin-media-grid{grid-template-columns:repeat(4,minmax(0,1fr))}

  /* Enciclopedias: más fichas visibles y relaciones mejor distribuidas. */
  .pedia-card-grid,
  .pedia-card-grid--npcs,
  .mission-card-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .pedia-related-list{grid-template-columns:repeat(4,minmax(0,1fr))}
  .pedia-variant-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .pedia-stat-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .pedia-filter__fields{grid-template-columns:minmax(300px,1.5fr) repeat(3,minmax(180px,1fr))}

  /* Formularios y paneles: dos zonas claras en lugar de una columna sobredimensionada. */
  .two-col,
  .split-section{grid-template-columns:minmax(0,2.15fr) minmax(320px,.85fr);gap:clamp(24px,2vw,38px)}
  .form-row{gap:24px}
  .admin-head{align-items:center}
  .admin-head nav{justify-content:flex-end;flex-wrap:wrap}

  /* Pie más equilibrado en monitores grandes. */
  .footer-grid{grid-template-columns:1.3fr .8fr 1fr;gap:clamp(40px,6vw,110px)}
}

@media (min-width:1680px){
  .gallery-grid.gallery-grid-dense{grid-template-columns:repeat(10,minmax(0,1fr))!important}
  .card-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .feature-card img{height:180px}
  .moderation-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .moderation-card{display:flex;min-height:300px;flex-direction:column}
  .moderation-card__body{flex:1}
  .moderation-page>.pagination,
  .moderation-results-head,
  .moderation-filters,
  .moderation-hero{grid-column:1/-1}
}

/* Portátiles: densidad intermedia, sin forzar el menú ni las rejillas. */
@media (min-width:1181px) and (max-width:1439px){
  :root{--site-gutter:28px}
  .container,.header-inner{width:calc(100% - (var(--site-gutter) * 2))}
}

/* Tableta y móvil conservan el comportamiento anterior y un margen respirable. */
@media (max-width:1000px){
  :root{--site-gutter:16px}
  .container,.header-inner{width:calc(100% - (var(--site-gutter) * 2))}
  .searchbar form{width:calc(100% - (var(--site-gutter) * 2))}
}

@media (max-width:680px){
  :root{--site-gutter:10px}
  main.container{padding-top:26px;padding-bottom:58px}
  .content-page,.comments,.flag-tool{max-width:100%}
  .form-card{max-width:100%;padding:20px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}

/* v2.50.33 · Campos de texto oscuros y coherentes en toda la aplicación */
:root{color-scheme:dark}
:where(
 input:not([type]),
 input[type="text"],input[type="search"],input[type="email"],input[type="password"],
 input[type="url"],input[type="tel"],input[type="number"],input[type="date"],
 input[type="datetime-local"],input[type="time"],input[type="month"],input[type="week"],
 textarea,select,[contenteditable="true"]
){
 min-width:0;
 background-color:var(--surface-input,#0e0d0b)!important;
 background-image:none;
 border-color:var(--border-strong,#65594d);
 color:var(--text-primary,#eee8dd)!important;
 caret-color:var(--accent2,#f2a65a);
 -webkit-text-fill-color:var(--text-primary,#eee8dd)!important;
 color-scheme:dark;
}
:where(
 input:not([type]),
 input[type="text"],input[type="search"],input[type="email"],input[type="password"],
 input[type="url"],input[type="tel"],input[type="number"],input[type="date"],
 input[type="datetime-local"],input[type="time"],input[type="month"],input[type="week"],
 textarea,select,[contenteditable="true"]
):hover{border-color:var(--border-accent,#8a6247)}
:where(
 input:not([type]),
 input[type="text"],input[type="search"],input[type="email"],input[type="password"],
 input[type="url"],input[type="tel"],input[type="number"],input[type="date"],
 input[type="datetime-local"],input[type="time"],input[type="month"],input[type="week"],
 textarea,select,[contenteditable="true"]
):focus{background-color:#0b0a09!important;border-color:var(--accent2,#f2a65a);color:var(--text-primary,#eee8dd)!important;-webkit-text-fill-color:var(--text-primary,#eee8dd)!important}
:where(input,textarea)::placeholder{color:var(--text-subtle,#948c80)!important;opacity:1;-webkit-text-fill-color:var(--text-subtle,#948c80)!important}
:where(select,select option,select optgroup){background-color:var(--surface-input,#0e0d0b)!important;color:var(--text-primary,#eee8dd)!important;-webkit-text-fill-color:var(--text-primary,#eee8dd)!important}
:where(input,textarea,select):disabled,:where(input,textarea,select)[readonly]{background-color:#171512!important;color:#aaa397!important;-webkit-text-fill-color:#aaa397!important;opacity:.72}
:where(input,textarea,select):-webkit-autofill,
:where(input,textarea,select):-webkit-autofill:hover,
:where(input,textarea,select):-webkit-autofill:focus{
 -webkit-text-fill-color:var(--text-primary,#eee8dd)!important;
 caret-color:var(--accent2,#f2a65a)!important;
 box-shadow:0 0 0 1000px var(--surface-input,#0e0d0b) inset!important;
 -webkit-box-shadow:0 0 0 1000px var(--surface-input,#0e0d0b) inset!important;
 transition:background-color 9999s ease-out 0s;
}
input[type="file"]{max-width:100%;background:var(--surface-input,#0e0d0b);border:1px solid var(--border-strong,#65594d);color:var(--text-primary,#eee8dd);-webkit-text-fill-color:var(--text-primary,#eee8dd);color-scheme:dark}
input[type="file"]::file-selector-button{min-height:var(--control-height,44px);margin:-1px .8rem -1px -1px;padding:.65rem .9rem;border:1px solid var(--border-strong,#65594d);background:#24211d;color:var(--text-primary,#eee8dd);cursor:pointer}
input[type="search"]::-webkit-search-cancel-button{filter:invert(1) opacity(.72)}
input[type="date"]::-webkit-calendar-picker-indicator,input[type="datetime-local"]::-webkit-calendar-picker-indicator,input[type="time"]::-webkit-calendar-picker-indicator,input[type="month"]::-webkit-calendar-picker-indicator,input[type="week"]::-webkit-calendar-picker-indicator{filter:invert(1) opacity(.72);cursor:pointer}
/* El compositor del modal de galería deja de ser la única excepción clara. */
.gallery-viewer-comment-form textarea{background:var(--surface-input,#0e0d0b)!important;color:var(--text-primary,#eee8dd)!important;-webkit-text-fill-color:var(--text-primary,#eee8dd)!important;caret-color:var(--accent2,#f2a65a)!important;border:1px solid var(--border-strong,#65594d)!important}
.gallery-viewer-comment-form textarea:focus{background:#0b0a09!important;border-color:var(--accent2,#f2a65a)!important}