:root{--papier:#f7f3ea;--encre:#1f1c17;--doux:#6b6357;--filet:#ddd4c3;--rouge:#b8321f;--ciel:#2c5f86;--carte:#fffdf8}
@media (prefers-color-scheme:dark){:root{--papier:#16191d;--encre:#e9e4da;--doux:#a39b8d;--filet:#343a42;--rouge:#e0674f;--ciel:#8bb8db;--carte:#1d2126}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papier);color:var(--encre);font:18px/1.65 "Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif}
a{color:var(--ciel)} a:hover{color:var(--rouge)}
.cadre{display:grid;grid-template-columns:250px minmax(0,1fr);max-width:1180px;margin:0 auto;min-height:100vh}
header.nav{position:sticky;top:0;align-self:start;height:100vh;overflow:auto;padding:32px 22px 24px;border-right:1px solid var(--filet)}
.marque{display:block;text-decoration:none;color:var(--encre);margin-bottom:28px}
.marque svg{width:46px;height:46px;display:block;margin-bottom:10px}
.marque b{display:block;font-size:22px;line-height:1.15;font-weight:600;letter-spacing:.01em}
.arobase::before {
    content: "\000040";
    font-size: inherit !important;
}
.arobase span {
    font-size: 1px;
    font-size: 0.1px;
    text-indent: -999px;
    width: 1px;
    overflow: hidden;
}
.marque span{display:block;font:13px/1.4 system-ui,sans-serif;color:var(--doux);margin-top:6px}
nav h3{font:600 11px/1 system-ui,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--doux);margin:18px 0 6px}
nav a{display:block;text-decoration:none;color:var(--encre);font-size:16px;padding:2px 0 2px 10px;border-left:2px solid transparent}
nav a:hover{color:var(--rouge)} nav a.ici{border-left-color:var(--rouge);color:var(--rouge)}
nav .pied{margin-top:26px;font:13px/1.5 system-ui,sans-serif}
nav .pied a{font-size:13px;padding-left:0;color:var(--doux)}
main{padding:48px 56px 40px;min-width:0}
.fil{font:13px system-ui,sans-serif;color:var(--doux);margin-bottom:6px}
h1{font-size:44px;line-height:1.1;font-weight:600;margin:0 0 28px;letter-spacing:-.01em}
article{margin:0 0 44px;max-width:720px}
article+article{border-top:1px solid var(--filet);padding-top:34px}
article h2{font-size:28px;line-height:1.2;font-weight:600;margin:0 0 16px}
article p{margin:0 0 1em}
.vignette{max-width:46%;height:auto;border-radius:3px;margin:4px 0 14px}
.vignette.gauche{float:left;margin-right:22px} .vignette.droite{float:right;margin-left:22px}
article::after{content:"";display:block;clear:both}
.bloc img,.corps>img,.corps p>img:not(.vignette){max-width:100%;height:auto;border-radius:3px}
.galerie{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:18px 0 22px;clear:both}
.galerie img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:3px;cursor:zoom-in;background:var(--filet)}
img.zoom{cursor:zoom-in}
a.externe::after{content:" ↗";font-size:.8em}
details.anciennes{margin:6px 0 0;font-size:16px;border:1px solid var(--filet);border-radius:6px;background:var(--carte)}
details.anciennes summary{cursor:pointer;padding:10px 14px;font:14px system-ui,sans-serif;color:var(--doux)}
details.anciennes .v{padding:4px 18px 14px;border-top:1px dashed var(--filet)}
details.anciennes .v h4{font:600 12px system-ui,sans-serif;text-transform:uppercase;letter-spacing:.08em;color:var(--doux);margin:14px 0 8px}
.disparu{background:var(--carte);border:1px solid var(--filet);border-radius:8px;padding:22px 24px}
.disparu .note{font:13px system-ui,sans-serif;color:var(--doux);margin:-6px 0 14px}
footer.origine{max-width:720px;margin-top:56px;padding-top:18px;border-top:2px solid var(--encre);font:14px/1.6 system-ui,sans-serif;color:var(--doux)}
footer.origine strong{color:var(--encre)}
footer.origine a{white-space:nowrap}
.suivant{display:flex;justify-content:space-between;gap:16px;margin-top:18px;font:15px system-ui,sans-serif}
.une{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;max-width:900px;margin:8px 0 36px}
.une a{display:block;text-decoration:none;color:var(--encre);background:var(--carte);border:1px solid var(--filet);border-radius:8px;overflow:hidden}
.une a:hover{border-color:var(--rouge)}
.une img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:var(--filet)}
.une span{display:block;padding:10px 12px;font-size:17px}
.recherche{max-width:720px;margin:0 0 30px}
.recherche input{width:100%;font:17px system-ui,sans-serif;padding:11px 14px;border:1px solid var(--filet);border-radius:8px;background:var(--carte);color:var(--encre)}
#resultats a{display:block;padding:8px 0;border-bottom:1px solid var(--filet);text-decoration:none}
#resultats small{display:block;color:var(--doux);font:13px system-ui,sans-serif}
.apropos{max-width:720px;font-size:16px;color:var(--doux)}
#visionneuse{position:fixed;inset:0;background:rgba(10,10,10,.92);display:flex;align-items:center;justify-content:center;z-index:9;padding:20px}
#visionneuse[hidden]{display:none!important}
#visionneuse img{max-width:100%;max-height:88vh;border-radius:3px}
#visionneuse button{position:absolute;top:12px;right:16px;font:28px system-ui;color:#fff;background:none;border:0;cursor:pointer}
#visionneuse .prec,#visionneuse .suiv{top:50%;transform:translateY(-50%);right:auto;font-size:40px}
#visionneuse .prec{left:10px} #visionneuse .suiv{right:10px}
.menu-mobile{display:none}
@media (max-width:860px){
 body{font-size:17px}
 .cadre{display:block}
 header.nav{position:static;height:auto;border-right:0;border-bottom:1px solid var(--filet);padding:16px}
 .marque{margin:0;display:flex;gap:12px;align-items:center} .marque svg{width:34px;height:34px;margin:0}
 .marque b{font-size:19px} .marque span{display:none}
 .menu-mobile{display:block;position:absolute;top:18px;right:16px;font:14px system-ui;background:none;border:1px solid var(--filet);border-radius:6px;padding:6px 10px;color:var(--encre)}
 header.nav{position:relative} nav{display:none} nav.ouvert{display:block}
 main{padding:26px 16px 30px}
 h1{font-size:32px} article h2{font-size:24px}
 .vignette{max-width:100%;float:none!important;margin:0 0 14px!important;display:block}
}