main{max-width:1880px;padding-inline:clamp(8px,1.5vw,24px)}.hero{width:100%;max-width:1760px;margin-inline:auto;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(28px,3vw,56px)}.hero img{width:100%;height:auto;max-height:760px;aspect-ratio:4 / 3;object-fit:cover}.grid,.section-top,.shelf,.night-panel{width:100%;max-width:1840px;margin-left:auto;margin-right:auto}.grid{width:100%}@media(min-width:701px){.hero h1{font-size:clamp(56px,5.4vw,92px);line-height:1.04}.hero p{max-width:720px;font-size:clamp(23px,1.8vw,32px);line-height:1.5}.hero .eyebrow{font-size:clamp(14px,1vw,18px)}.hero .button{font-size:22px;padding:20px 32px}.hero .small{font-size:21px}.hero-story-caption{font-size:21px;padding:18px}.ribbon{font-size:19px}.section-top>.eyebrow,.section-top .eyebrow,.eyebrow{font-size:16px;letter-spacing:3px}.section-top h2,.shelf h2{font-size:clamp(44px,3.6vw,64px)}.section-top .button{font-size:19px;padding:17px 24px}.grid{column-gap:clamp(24px,2.3vw,44px);row-gap:clamp(32px,2.8vw,52px)}.card img{aspect-ratio:1.15}.card h3{font-size:clamp(28px,2vw,38px);margin:16px 0}.card p{font-size:clamp(18px,1.3vw,23px);line-height:1.55}.card .meta,.card .small{font-size:18px}.card-cta{font-size:19px;padding:15px 20px}}@media(max-width:700px){main{padding-inline:16px}.hero{grid-template-columns:1fr;gap:18px}.hero img{max-height:360px;aspect-ratio:4 / 3;object-fit:cover}.hero h1{font-size:clamp(34px,7vw,44px)}.hero p{font-size:18px}.hero .button{font-size:inherit;padding:13px 23px}.hero .small{font-size:14px}.hero-story-caption{font-size:15px;padding:12px}.ribbon{font-size:14px}.section-top h2,.shelf h2{font-size:38px}.section-top .button{font-size:15px;padding:13px 23px}.eyebrow{font-size:12px;letter-spacing:2.5px}.grid{column-gap:12px;row-gap:12px}.card h3{font-size:18px}.card p{font-size:13px;line-height:1.35}.card .meta,.card .small{font-size:12px}.card-cta{font-size:12px;padding:7px 9px}}@media(max-width:480px){main{max-width:none;padding-inline:16px}.hero img{width:100%;max-width:100%;height:auto;aspect-ratio:4 / 3;object-fit:contain;max-height:340px}}

/* Library: native category radios preserve the existing combined filter logic. */
.filters.library-filters{display:flex;flex-direction:column;gap:24px;padding:24px;border:1px solid var(--line);border-radius:20px;background:var(--paper)}
.library-filters .search-label{display:block;font-size:18px;font-weight:600}
.search-field{display:flex;align-items:center;gap:12px;margin-top:10px;padding:0 16px;background:var(--cream);border:1px solid var(--line);border-radius:12px}
.search-field:focus-within{outline:2px solid var(--gold);outline-offset:3px}
.filters .search-field input{min-width:0;padding:16px 0;border:0;background:transparent;font-size:17px;outline:none}
.theme-buttons{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;border:0;min-width:0}
.theme-buttons legend{font-size:15px;font-weight:600;margin-bottom:12px;color:var(--muted)}
.theme-choice{position:relative;cursor:pointer}
.theme-choice input{position:absolute;opacity:0;width:1px;height:1px}
.theme-choice>span{display:flex;align-items:center;gap:8px;min-height:46px;padding:10px 16px;border:1px solid var(--line);border-radius:30px;background:var(--cream);color:var(--navy);font-size:15px}
.theme-choice>span>span{font-size:20px}
.theme-choice input:checked+span{background:var(--navy);color:var(--cream);border-color:var(--navy);font-weight:700}
.theme-choice input:focus-visible+span{outline:3px solid var(--gold);outline-offset:3px}
.theme-choice:hover>span{border-color:var(--gold)}
.optional-filters{display:flex;align-items:flex-end;flex-wrap:wrap;gap:14px;padding-top:20px;border-top:1px solid var(--line)}
.optional-filters>label{flex:1;min-width:160px;color:var(--muted)}
.optional-filters select{margin-top:6px;min-height:46px}
.optional-filters button{min-height:46px}
@media(max-width:480px){.filters.library-filters{padding:16px;gap:20px}.theme-buttons{gap:8px}.theme-choice>span{padding:9px 12px;font-size:14px}.optional-filters{gap:12px}.optional-filters>label{min-width:0;flex-basis:calc(50% - 6px)}.optional-filters button{width:100%}.library-filters .search-label{font-size:17px}}

/* Portada: lectura clara y acceso directo a las colecciones. */
.hero h1{font-size:clamp(34px,4.2vw,58px)}.hero-story{display:block;min-width:0;text-decoration:none}.hero-story img{display:block;border-radius:24px;object-fit:contain;aspect-ratio:auto;max-height:560px}.hero-story-caption{display:block;text-align:center;font-size:15px;padding:12px;text-decoration:underline;text-underline-offset:4px}.hero-story:hover .hero-story-caption{color:var(--gold)}.section-top .button{flex-shrink:0;font-size:16px}.explore-bottom{text-align:center;margin:20px 0 36px}@media(max-width:700px){.section-top{align-items:flex-start;flex-direction:column;gap:8px;margin-bottom:24px}.section-top h2{margin-bottom:12px}.hero h1{font-size:clamp(34px,7vw,44px)}.hero-story img{max-height:360px}.section-top .button{font-size:15px}}

.story-categories{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin:22px auto}.story-categories>span{width:100%;font-size:14px;font-weight:700;color:var(--muted)}.story-categories a{display:inline-flex;align-items:center;min-height:44px;padding:8px 15px;border:1px solid var(--line);border-radius:24px;background:var(--paper);font-size:15px;text-decoration:none}.story-categories a:hover{border-color:var(--gold)}.toolbar{max-width:760px}.toolbar button{min-height:44px}@media(max-width:480px){.story-categories{gap:8px}.story-categories a{font-size:14px;padding:8px 12px}.toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.toolbar button{padding:10px 8px}}

/* Dormant placements: hidden until a reviewed adapter reserves before paint. */
.reading-layout{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,700px) minmax(0,1fr);align-items:start}
.reading-layout>.story{grid-column:2;grid-row:1;width:100%;min-width:0}
.ad-placement[hidden]{display:none!important}
.ad-placement{box-sizing:border-box;min-width:0;text-align:center;font-family:system-ui,sans-serif}
.ad-label{font-size:12px;color:var(--muted);margin:0 0 12px;letter-spacing:.04em}
.ad-sidebarRight,.ad-sectionBreak{display:none}
.ad-storyEnd,.ad-sectionBreak{width:var(--ad-width,250px);max-width:100%;margin:48px auto}
.ad-placement .ad-label{height:24px;line-height:24px;margin:0 0 12px}
.ad-mount{width:var(--ad-width,250px);height:var(--ad-height,250px);max-width:100%;overflow:hidden;contain:layout paint}
.ad-placement[data-state="pending"] .ad-mount{visibility:hidden}
@media(max-width:700px){.ad-sectionBreak{display:block}}
@media(min-width:1720px){
  .reading-layout[data-ad-layout="sidebar"]{grid-template-columns:minmax(0,1fr) minmax(0,1200px) 300px minmax(0,1fr);column-gap:32px}
  .ad-sidebarRight{display:block;grid-column:3;grid-row:1;width:300px;margin-top:48px;justify-self:center}
}
@media print{.ad-placement{display:none!important}.reading-layout{display:block}}

/* Cabecera amplia solo en escritorio; se conserva el diseño móvil. */
@media screen and (min-width:1024px){
  body>header{width:100%;max-width:none;min-height:104px;padding:24px clamp(28px,4vw,80px);gap:32px}
  body>header>.brand{width:auto;max-width:none;flex-shrink:0;overflow:visible;font-size:clamp(32px,2.5vw,42px)}
  body>header>nav{gap:clamp(20px,2.5vw,48px);margin-left:auto}
  body>header>nav>a{display:inline-flex;align-items:center;min-height:48px;padding:8px 4px;font-size:clamp(17px,1.2vw,21px);font-weight:500}
}
.filter-group{border:1px solid var(--line);border-radius:14px;background:var(--paper);padding:0 16px}.filter-group>summary{cursor:pointer;list-style:none;padding:15px 0;font-size:17px;font-weight:700;color:var(--navy);display:flex;align-items:center;justify-content:space-between}.filter-group>summary::-webkit-details-marker{display:none}.filter-group>summary::after{content:'＋';font-size:22px;color:var(--gold)}.filter-group[open]>summary::after{content:'−'}.filter-group[open]{padding-bottom:18px}.filter-group .theme-buttons{padding-top:4px}.filter-group .optional-filters{margin-top:18px}
/* Reader controls: quiet, compact and repeated after the story. */
.reader-head+.toolbar{margin:18px auto 28px}.toolbar{gap:8px}.toolbar button{border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--navy);padding:8px 13px;min-height:40px;font-size:14px}.toolbar button:hover{border-color:var(--gold);background:var(--cream)}.toolbar button[data-save]{background:var(--navy);color:var(--cream);border-color:var(--navy)}.story+.toolbar{margin:30px auto 18px;border-top:1px solid var(--line);padding-top:20px}@media(max-width:480px){.toolbar{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.toolbar button{min-height:42px;padding:8px 6px;font-size:13px}.reader-head+.toolbar{margin-top:12px}.story+.toolbar{margin-top:20px}}
.global-reader-controls{display:flex;align-items:center;gap:6px;margin-left:8px}.global-reader-controls button{border:1px solid var(--line);background:transparent;color:var(--navy);border-radius:999px;padding:7px 10px;font-size:13px;cursor:pointer}.global-reader-controls button:hover{border-color:var(--gold);background:var(--paper)}@media(max-width:700px){.global-reader-controls{width:100%;margin:0;padding-top:8px;border-top:1px solid var(--line);justify-content:flex-end}.global-reader-controls button{font-size:12px;padding:6px 9px}}@media(min-width:1024px){body>header{flex-wrap:wrap}.global-reader-controls{order:3;width:100%;justify-content:flex-end;margin:0;padding-top:10px;border-top:1px solid var(--line)}}
.global-reader-controls{display:none!important}.reader-head+.toolbar{display:flex;flex-wrap:nowrap;justify-content:center;gap:8px}.reader-head+.toolbar button{flex:1;white-space:nowrap;min-width:0;padding-inline:8px}@media(max-width:480px){.reader-head+.toolbar button{font-size:12px;padding-inline:4px}.reader-head+.toolbar{gap:5px}}
/* Escritorio: lectura amplia, textos y controles legibles. */
@media screen and (min-width:701px){
  body{font-size:20px}
  main{padding-inline:8px}
  body>header{padding-inline:clamp(20px,2vw,40px)}
  body>header>nav>a{font-size:19px}
  .reader-head{width:100%;max-width:1400px;margin:36px auto 24px}
  .reader-head h1{font-size:clamp(58px,5vw,88px);line-height:1.05}
  .reader-head .meta{font-size:20px;letter-spacing:1.5px}
  .story-categories>span{font-size:18px}
  .story-categories a{font-size:19px;min-height:52px;padding:10px 20px}
  .reader-head+.toolbar{width:min(96%,1280px);max-width:1280px;gap:16px;margin:24px auto 32px}
  .reader-head+.toolbar button{min-height:58px;font-size:20px;padding:12px 22px}
  .reader-head + .toolbar + .cover{width:min(94%,1080px);max-height:680px;margin:0 auto 14px}
  .reading-layout{grid-template-columns:minmax(0,1fr) minmax(0,min(74vw,1200px)) minmax(0,1fr)}
  .reading-layout>.story{max-width:1200px;margin-top:12px;font-size:clamp(30px,calc(var(--reading-size,18px)*1.7),48px);line-height:1.8}
  .story p{margin:1em 0}
  .story>.small{font-size:19px}
  .story+.toolbar{width:min(96%,1280px);max-width:1280px;gap:16px}
  .story+.toolbar{display:flex;flex-wrap:nowrap;justify-content:center;align-items:stretch;gap:14px}
  .story+.toolbar button{flex:1 1 0;min-width:0;min-height:68px;font-size:clamp(18px,1.25vw,22px);line-height:1.25;padding:14px 16px;white-space:normal;border-radius:16px}
  .toolbar button{font-size:clamp(18px,1.25vw,22px);line-height:1.25;min-height:60px;padding:14px 18px}
  .reader-head+.toolbar button{white-space:normal}
  .questions,.related{max-width:1200px;font-size:21px}
  .questions h2,.related h2{font-size:clamp(38px,3vw,54px)}
  .related{width:100%;max-width:1800px;margin:52px auto}
  .related>.grid{width:100%;max-width:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,3vw,56px)}
  .related .card img{aspect-ratio:1.1}
  .related .card h3{font-size:clamp(30px,2.2vw,42px)}
  .related .card p{font-size:clamp(19px,1.4vw,25px)}
  .reading-layout~.toolbar{display:flex;flex-wrap:nowrap;justify-content:center;align-items:stretch;width:min(96%,1500px);max-width:1500px;margin:34px auto;padding-top:24px;gap:14px}
  .reading-layout~.toolbar button{flex:1 1 0;min-width:0;min-height:68px;padding:14px 18px;font-size:clamp(18px,1.25vw,24px);line-height:1.25;white-space:normal;border-radius:16px}
  footer{max-width:1760px;padding-inline:8px}
  footer .links{font-size:18px}
}
/* Galería y textos auxiliares: escala cómoda en monitores. */
@media screen and (min-width:701px){
  .intro{width:min(100%,1100px);max-width:1100px;margin:48px 0 40px}
  .intro .eyebrow,.eyebrow{font-size:20px;letter-spacing:3px}
  .intro h1{font-size:clamp(54px,4.2vw,72px);line-height:1.08}
  .intro p{font-size:clamp(21px,1.5vw,26px);line-height:1.55;max-width:1000px}
  .small,.meta{font-size:18px}
  .color-grid{gap:24px}
  .color-card{padding:16px;gap:14px}
  .color-card h3{font-size:clamp(22px,1.6vw,28px);line-height:1.2}
  .color-card .drawing-actions{gap:10px}
  .color-card .drawing-actions .button{min-height:56px;padding:12px 16px;font-size:18px;line-height:1.25}
  .hero-story-caption{font-size:21px}
  main:has(>.hero)>.section-top .button,
  main:has(>.hero)>section>.section-top .button,
  main:has(>.hero)>.section-top+.grid .button{min-height:62px;padding:16px 28px;font-size:21px;line-height:1.25}
  main:has(>.hero)>.ribbon{min-height:76px;padding:20px 12px;font-size:22px;gap:24px}
  main:has(>.hero)>.ribbon a,main:has(>.hero)>.ribbon span{font-size:22px;line-height:1.3}
}
/* Lectura: portada más contenida y primer párrafo cercano. */
.reader-head + .toolbar + .cover{width:min(92%,620px);max-height:460px;margin:0 auto 8px;display:block;object-fit:cover}.reading-layout>.story{margin-top:8px}@media(max-width:700px){.reader-head + .toolbar + .cover{width:88%;max-height:330px;border-radius:18px}.reading-layout>.story{margin-top:4px}}
.nav-drawings{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:10px 18px;border-radius:999px;background:var(--navy);color:var(--cream)!important;font-weight:700;text-decoration:none;box-shadow:0 3px 0 rgba(24,44,67,.18)}.nav-drawings:hover{background:#294666;transform:translateY(-1px)}
@media screen and (min-width:701px){body>header{gap:clamp(28px,4vw,72px)}body>header>.brand{font-size:clamp(36px,2.8vw,50px)}body>header>nav{gap:clamp(20px,2.2vw,42px)}body>header>nav>a{font-family:Georgia,'Times New Roman',serif;font-size:clamp(20px,1.45vw,27px);font-weight:600;letter-spacing:.01em;min-height:58px;padding:10px 8px}body>header>nav>.nav-drawings{font-family:inherit;font-size:clamp(19px,1.35vw,25px);padding-inline:22px}}
@media(max-width:700px){.nav-drawings{min-height:40px;padding:7px 10px;font-size:13px;border-radius:999px}}

/* Desktop proportions: centered content; mobile rules remain untouched. */
@media screen and (min-width:1024px){
 body{font-size:19px}
 body>main{width:calc(100% - 64px);max-width:1160px;padding-inline:24px}
 body>header{max-width:1160px;padding:22px 24px;min-height:90px;gap:28px}
 body>header>.brand{font-size:34px}
 body>header>nav{gap:26px}
 body>header>nav>a{font-size:20px;min-height:46px}
 body>header>nav>.nav-drawings{font-size:19px;padding:9px 16px}
 .hero{max-width:1220px;gap:56px;padding:48px 0 52px}
 .hero h1{font-size:48px;line-height:1.12;letter-spacing:-1px}
 .hero p{font-size:20px;line-height:1.55;max-width:540px}
 .hero .eyebrow,.eyebrow,.intro .eyebrow{font-size:13px;letter-spacing:2px}
 .hero .small,.hero-story-caption{font-size:16px}
 .hero .button{font-size:18px;padding:13px 22px}
 .hero-story img{max-height:400px;border-radius:20px}
 .grid,.section-top,.shelf{max-width:100%}
 .grid{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:32px;row-gap:30px}
 .card{margin-bottom:16px}
 .card img{aspect-ratio:16 / 9;border-radius:12px}
 .card h3{font-size:24px;line-height:1.2;margin:14px 0 8px}
 .card p{font-size:17px;line-height:1.5;margin:8px 0 12px}
 .card .meta,.card .small{font-size:13px;letter-spacing:.6px}
 .card .button,.card-cta{font-size:16px;min-height:44px;padding:10px 16px}
 .save{width:40px;height:40px;min-height:0;padding:0;font-size:22px}
 .section-top{gap:24px;margin-bottom:22px}
 .section-top h2,.shelf h2{font-size:40px;line-height:1.15}
 main:has(>.hero)>.section-top .button,main:has(>.hero)>section>.section-top .button,main:has(>.hero)>.section-top+.grid .button{font-size:17px;min-height:46px;padding:12px 20px}
 main:has(>.hero)>.ribbon{min-height:62px;padding:17px 12px;margin-bottom:36px;gap:20px}
 main:has(>.hero)>.ribbon a,main:has(>.hero)>.ribbon span{font-size:18px;line-height:1.4}
 .intro h1{font-size:48px}
 .intro p{font-size:20px;max-width:920px}
 body>footer{width:calc(100% - 64px);max-width:1160px;padding-inline:24px}
}