@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600&family=Inter:wght@400;500;600&display=swap");:root{--bg:#ead7c5;--paper:#f5eadf;--terra:#b65f3e;--terra2:#8c432e;--wood:#6d4937;--wood2:#3f2b24;--ink:#3a2a23;--muted:#7f675a;--line:#cfad98;--cream:#fff8f0}*{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--ink);font-family:Inter,sans-serif;background:radial-gradient(circle at 15% 20%,rgba(182,95,62,.11),transparent 26%),radial-gradient(circle at 80% 75%,rgba(109,73,55,.08),transparent 28%),var(--bg)}body:before{content:"";position:fixed;inset:0;z-index:-1;opacity:.45;background:repeating-radial-gradient(circle at 25% 35%,rgba(93,58,43,.05) 0 1px,transparent 1px 5px),repeating-linear-gradient(0deg,rgba(70,45,34,.02) 0 1px,transparent 1px 4px)}.hidden{display:none!important}.auth-gate{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(430px,92vw);display:grid;gap:16px;background:rgba(245,234,223,.92);border:1px solid var(--line);padding:30px}.linkbtn{border:0;background:none;color:var(--terra2);text-align:left;padding:0;cursor:pointer}button,input,textarea,select{font:inherit}header{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:20px 5vw;background:rgba(234,215,197,.92);border-bottom:1px solid rgba(140,67,46,.14)}.brand{border:0;background:none;color:var(--terra2);font:600 25px "Cormorant Garamond";letter-spacing:.18em}.eyebrow{font-size:10px;letter-spacing:.18em;color:var(--terra2);font-weight:600}nav{display:flex;gap:18px;flex-wrap:wrap}nav button{background:none;border:0;color:var(--muted)}main{width:min(1160px,90vw);margin:auto;padding:58px 0 88px}.view{display:none}.view.active{display:block}.hero{display:flex;justify-content:space-between;gap:40px;align-items:end}h1,h2,h3,blockquote{font-family:"Cormorant Garamond";font-weight:500}h1{font-size:clamp(54px,8vw,92px);line-height:.9;margin:8px 0 18px;color:var(--wood2)}h2{font-size:32px}.intro{font-size:17px;color:var(--muted);max-width:650px;line-height:1.7}.live{min-width:310px;border-top:1px solid var(--terra);padding:16px 18px 18px;display:grid;gap:5px;background:rgba(245,234,223,.72)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:44px}.card{background:rgba(245,234,223,.82);border:1px solid rgba(140,67,46,.14)}.visual,.thumb{padding:18px;display:flex;align-items:flex-end;color:var(--cream);font:500 23px "Cormorant Garamond";background-size:cover;background-position:center}.visual{height:230px}.thumb{height:90px}.t0{background-color:#b96647}.t1{background-color:#9f6d55}.t2{background-color:#8d6b56}.t3{background-color:#c47a58}.pad{padding:20px}.pad p,.item p,.note p{color:var(--muted)}.pad a{color:var(--terra2);text-decoration:none}.note{max-width:760px;margin:46px auto 0;padding:26px 30px;border:1px solid rgba(140,67,46,.14);background:rgba(242,228,215,.62)}blockquote{font-size:clamp(21px,2.2vw,30px);line-height:1.25;max-width:650px;margin:10px 0 12px}.note p{font-size:14px;line-height:1.55}.manifesto{display:flex;justify-content:space-around;padding:35px 0;font:500 clamp(28px,4vw,48px) "Cormorant Garamond";color:var(--terra2)}.filters,.tabs{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0}.filters button,.tab{border:1px solid var(--line);background:rgba(245,234,223,.62);color:var(--muted);padding:9px 14px}.filters .active,.tab.active{background:var(--terra);color:var(--cream)}.library{display:grid;grid-template-columns:1fr 1fr;gap:17px}.item{display:grid;grid-template-columns:135px 1fr;gap:17px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:16px}.panel{display:none}.panel.active{display:block}.adminGrid{display:grid;grid-template-columns:.9fr 1.1fr;gap:45px}.editor{display:grid;gap:16px;background:rgba(245,234,223,.75);border:1px solid var(--line);padding:26px}.editor.wide{grid-template-columns:1fr 1fr}.editor .full{grid-column:1/-1}.editor label{font-size:11px;color:var(--muted)}.editor input,.editor textarea,.editor select,.login-card input{width:100%;margin-top:7px;padding:11px;background:rgba(255,248,240,.78);border:1px solid #d7b7a2;color:var(--ink)}textarea{min-height:90px}.check{display:flex;align-items:center;gap:8px}.check input{width:auto}.primary{background:var(--terra);color:var(--cream);border:0;padding:12px;cursor:pointer}.hint{font-size:12px;color:var(--muted);white-space:pre-wrap}.row{display:grid;grid-template-columns:1fr auto;gap:10px;border-bottom:1px solid var(--line);padding:12px 0}.row button{background:none;border:0;color:var(--terra2)}footer{display:flex;justify-content:space-between;padding:24px 5vw;border-top:1px solid var(--line);color:var(--muted)}@media(max-width:850px){.hero{display:block}.live{margin-top:28px}.grid{grid-template-columns:1fr 1fr}.library{grid-template-columns:1fr}.adminGrid{grid-template-columns:1fr}.editor.wide{grid-template-columns:1fr}}@media(max-width:600px){.grid{grid-template-columns:1fr}.item{grid-template-columns:105px 1fr}.manifesto{flex-direction:column}}
@media(max-width:600px){
  .note{padding:22px 20px;margin-top:36px}
  blockquote{font-size:22px}
}

/* V6.8 · Reproductor de YouTube dentro de El Club */
.card.video-content,.item.video-content{cursor:pointer}
.card.video-content:focus-visible,.item.video-content:focus-visible{outline:2px solid var(--terra);outline-offset:3px}
.open-content{display:inline-block;margin-top:8px;color:var(--terra2);font-size:14px}
.video-modal{position:fixed;inset:0;z-index:1000;background:rgba(45,31,25,.82);display:grid;place-items:center;padding:22px}
.video-shell{width:min(1080px,96vw);background:var(--paper);border:1px solid rgba(255,248,240,.25);box-shadow:0 20px 60px rgba(32,21,17,.28)}
.video-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;padding:18px 20px 14px;border-bottom:1px solid var(--line)}
.video-head h2{font-size:clamp(25px,3vw,38px);line-height:1;margin:4px 0 0;color:var(--wood2)}
.video-close{border:1px solid var(--line);background:transparent;color:var(--terra2);padding:8px 12px;cursor:pointer}
.video-frame-wrap{position:relative;width:100%;aspect-ratio:16/9;background:#1d1714}
.video-frame-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
body.video-open{overflow:hidden}
@media(max-width:600px){
  .video-modal{padding:10px}
  .video-head{padding:14px}
  .video-close{padding:7px 10px}
}


/* V6.12 — Modal de vídeo desplazable */
.video-modal{
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding:24px 0;
}
.video-shell{
  margin:auto;
  max-height:none;
}
body.video-open{
  overflow:hidden;
}

@media (max-width: 700px){
  .video-modal{
    padding:0;
  }
  .video-shell{
    width:100%;
    min-height:100%;
    margin:0;
  }
}


/* V6.14 — Subida directa de portadas */
.field-help{display:block;margin-top:7px;font-size:11px;line-height:1.45;color:var(--muted)}
.cover-preview-wrap{display:grid;gap:10px}
.cover-preview{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border:1px solid var(--line);background:var(--paper)}
.secondary{border:1px solid var(--line);background:transparent;color:var(--terra2);cursor:pointer}
.small-btn{justify-self:start;padding:8px 11px}
.editor button:disabled{opacity:.6;cursor:wait}
.visual,.thumb{background-repeat:no-repeat}
.visual{background-position:center}
.thumb{background-position:center}


/* V6.16 — Escala compacta real: 3 tarjetas visibles de una vez */

/* Contenedor un poco más ancho y tipografía algo más contenida */
main{
  width:min(1320px,94vw);
  padding:42px 0 64px;
}
header{
  padding:16px 4vw;
}
.brand{
  font-size:22px;
}
nav{
  gap:14px;
}
nav button{
  font-size:13px;
}

h1{
  font-size:clamp(44px,5.8vw,70px);
  margin:6px 0 14px;
}
h2{
  font-size:28px;
}
.intro{
  font-size:15px;
  line-height:1.6;
}

/* Inicio: tres contenidos siempre en una sola fila en escritorio */
.grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-top:32px;
  width:100%;
  overflow:visible;
}
.grid > *{
  min-width:0;
  width:100%;
}

/* Tarjetas notablemente más pequeñas */
.card{
  min-width:0;
  width:100%;
}
.visual{
  height:auto;
  aspect-ratio:16/9;
  padding:12px;
  font-size:18px;
}
.pad{
  padding:14px;
}
.pad h3{
  font-size:20px;
  margin:0 0 6px;
}
.pad p{
  font-size:13px;
  line-height:1.45;
  margin:6px 0;
}
.open-content{
  margin-top:5px;
  font-size:12px;
}

/* Bloques secundarios también más discretos */
.live{
  min-width:260px;
  padding:12px 14px 14px;
  font-size:13px;
}
.note{
  margin-top:34px;
  padding:20px 24px;
}
blockquote{
  font-size:clamp(19px,1.9vw,26px);
}
.note p{
  font-size:13px;
}
.manifesto{
  padding:26px 0;
  font-size:clamp(24px,3vw,38px);
}

/* Biblioteca: dos columnas más compactas */
.library{
  gap:14px;
}
.item{
  grid-template-columns:110px 1fr;
  gap:13px;
  padding-bottom:12px;
}
.thumb{
  height:72px;
  padding:10px;
  font-size:17px;
}
.item h3{
  font-size:19px;
  margin:0 0 4px;
}
.item p{
  font-size:12px;
  margin:4px 0;
}

/* Filtros y admin */
.filters,.tabs{
  margin:20px 0;
}
.filters button,.tab{
  padding:7px 11px;
  font-size:12px;
}
.editor{
  gap:12px;
  padding:20px;
}
.editor input,.editor textarea,.editor select,.login-card input{
  padding:9px 10px;
  font-size:13px;
}
.primary{
  padding:10px;
  font-size:13px;
}

/* Tablet: tres siguen entrando; móvil sí apila */
@media(max-width:850px){
  .grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
  }
  .visual{
    padding:9px;
    font-size:15px;
  }
  .pad{
    padding:10px;
  }
  .pad h3{
    font-size:17px;
  }
}
@media(max-width:650px){
  main{width:92vw}
  .grid{grid-template-columns:1fr}
  .visual{font-size:18px}
  .pad{padding:13px}
}