:root{font-family:Inter,system-ui,sans-serif;color:#18283a;background:#f4f7fa;line-height:1.6;--ink:#102338;--teal:#067a71;--edge:#dce5ec}
*{box-sizing:border-box}
body{margin:0}
a{color:var(--teal);text-underline-offset:3px}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #32b9a7;outline-offset:3px}
.frame{width:min(1120px,calc(100% - 40px));margin-inline:auto}
header{background:#101f32;color:#fff}
.header,.footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:17px}
.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;font-weight:750}
.brand small{display:block;font-size:.76rem;font-weight:400;color:#b7c9d9}
.brand-mark{display:grid;place-items:center;width:42px;height:42px;border:1px solid #49b9ac;border-radius:10px;color:#79e4d4}
.header nav{display:flex;gap:24px;flex-wrap:wrap}
.header nav a,.footer a{color:inherit;text-decoration:none}
.header nav a:hover,.footer a:hover{text-decoration:underline}
.hero{background:radial-gradient(ellipse at 88% 30%,#1a565b,transparent 62%),linear-gradient(120deg,#112438,#142f49);color:white;padding:60px 0 64px;border-bottom:4px solid #44b7a5}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(2.45rem,6vw,4.8rem);line-height:1.04;letter-spacing:-.045em;margin-bottom:18px}
.hero p{color:#c6dae3;font-size:1.1rem}
.button{display:inline-block;background:#8be2d0;color:#0b3031;font-weight:750;padding:10px 16px;border-radius:8px;text-decoration:none}
.content{padding-block:36px 64px}
h2{font-size:clamp(1.65rem,4vw,2.2rem);letter-spacing:-.025em;margin-bottom:18px}
.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
.card,.library aside,.group{background:#fff;border:1px solid var(--edge);border-radius:14px;overflow:hidden}
.cover{display:block;background:#132b42}
.cover img{display:block;width:100%;aspect-ratio:2.1;object-fit:contain}
.card-body{padding:22px}
.card h3{margin-bottom:1px;font-size:1.35rem}
.subtitle{color:var(--teal);font-weight:650}
summary{cursor:pointer;font-weight:700;color:var(--teal)}
details[open] summary{margin-bottom:14px}
.external{display:inline-block;margin-top:16px;font-weight:700}
#pdf{margin-top:45px}
.library{display:grid;grid-template-columns:235px minmax(0,1fr);gap:22px;align-items:start}
aside nav{display:grid;padding:12px}
aside a{padding:8px 10px;border-radius:7px;text-decoration:none;font-weight:600}
aside a:hover{background:#e9f5f2}
.filters{display:grid;grid-template-columns:1.4fr 1fr;gap:12px}
label{display:grid;gap:4px;font-weight:650;font-size:.9rem}
input,select{width:100%;min-width:0;padding:9px 10px;border-radius:8px;border:1px solid #aebecb;background:white;color:inherit;font:inherit}
#count{color:#536679;margin:12px 0}
.group{margin-bottom:14px;scroll-margin-top:12px}
.group h3{padding:12px 16px;margin:0;background:#eaf1f6}
.group small{font-weight:500;margin-left:6px;color:#536679}
.group ul{list-style:none;margin:0;padding:0}
.file{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px 14px;border-top:1px solid var(--edge)}
.file a{overflow-wrap:anywhere}
.file-icon{font-size:.68rem;font-weight:800;color:#215360;background:#ddf1ed;padding:2px 5px;border-radius:4px}
.download{font-size:.82rem;font-weight:700}
[hidden]{display:none!important}
footer{background:var(--ink);color:#d6e5ed}
.skip{position:absolute;left:16px;top:-100px;background:white;padding:8px;z-index:1}
.skip:focus{top:8px}
@media(max-width:710px){.header{align-items:flex-start;flex-direction:column;gap:10px}.header nav{gap:16px}.hero{padding-block:42px}.cards,.library{grid-template-columns:1fr}.library aside nav{grid-template-columns:repeat(2,minmax(0,1fr))}.frame{width:calc(100% - 28px)}}
@media(max-width:420px){.filters{grid-template-columns:1fr}.card-body{padding:16px}.file{gap:7px;padding-inline:9px}.footer{flex-wrap:wrap}}