@font-face{font-family:Headline;src:url(kinselection-font-headline.ttf)}
@font-face{font-family:Codex;src:url(kinselection-font-codex.ttf)}
@font-face{font-family:CodexNote;src:url(kinselection-font-codex-kursiv.ttf)}
:root{--paper:#fcf3e4;--ink:#111;--line:#342e25;--measure:44rem}
body::before{content:"";position:fixed;inset:0;background:url(outer-frame-bg.webp) center/107% 105.2% no-repeat;pointer-events:none;z-index:-1}
.gallery{width:100%;max-width:none}.art-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:1.4rem}.gallery-card{display:flex;flex-direction:column;align-items:center;color:var(--ink);text-decoration:none;padding:.5rem;text-align:center;min-width:0}.gallery-picture{width:100%;height:210px;margin:0 0 .75rem}.gallery-picture img{width:100%;height:100%;object-fit:contain}.gallery-card span{font:1.2rem Headline}.gallery-card:hover span,.gallery-card:focus-visible span{text-decoration:underline;text-underline-offset:.25rem}.gallery-card:focus-visible{outline:1px solid var(--ink);outline-offset:4px}
*{box-sizing:border-box}html{background:#151513;color:var(--ink)}
body{--page-margin:clamp(1rem,3vw,3rem);margin:0;padding:var(--page-margin);background:linear-gradient(#fcf3e479,#fcf3e479),url(codex-background.webp) center/cover fixed;font:18px/1.38 Codex,serif;min-height:100vh;box-shadow:0 10px 45px #0008;display:grid;grid-template-columns:minmax(12rem,17rem) 1fr;position:relative;isolation:isolate}.paper-sketches{position:fixed;inset:0;overflow:clip;contain:paint;pointer-events:none;z-index:-1;mix-blend-mode:multiply}.paper-sketch{position:absolute;height:auto;opacity:.2;transform-origin:center}
.book-nav{padding:2rem 1.4rem;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:.3rem}.book-name{display:flex;flex-direction:column;align-items:center;margin-bottom:1.25rem}.book-nav strong{font:2.35rem Headline;letter-spacing:.04em}.book-name em{font:1rem CodexNote}.book-nav a{font:1.25rem Headline;color:inherit;text-decoration:none;padding:.5rem .8rem;border-bottom:1px solid #342e2540}.book-nav a:hover,.book-nav a.active{color:var(--paper);background:var(--ink)}
h1,h2,h3{font-family:Headline;margin:0 0 .65rem;letter-spacing:.02em}h1{font-size:clamp(2.6rem,5vw,4.8rem)}h2{font-size:1.45rem;margin-top:2rem;border-bottom:1px solid var(--line);padding-bottom:.35rem}h3{font-size:1.1rem}.lead{font-size:1.35rem;margin:0 0 1.5rem}.prose{max-width:var(--measure);margin:0 auto}.prose p{margin:.55rem 0 1rem}.caption,.field-note,.thought-note{font-family:CodexNote}.caption{text-align:center;margin:.75rem 0 1.75rem}.field-note{max-width:34rem;margin:1rem auto;padding-left:1.5rem;border-left:2px solid var(--line)}.thought-ornament{display:block;width:1.12rem;height:.51rem;object-fit:contain;margin:1.8rem auto .6rem;filter:brightness(0)}.thought-note{max-width:38rem;margin:.35rem auto 1.75rem;padding:0;text-align:center;border:0;font-size:1.55rem;line-height:1.35}.thought-note p{margin:0}.thought-note p:before{content:"„"}.thought-note p:after{content:"“"}.end-ornament{display:block;width:1.32rem;height:.66rem;object-fit:contain;margin:3rem auto 2rem;filter:brightness(0)}
.article{display:grid;grid-template-columns:minmax(20rem,1fr) minmax(15rem,19rem);gap:2.5rem;padding:2rem 2.5rem;min-width:0}.article>article{min-width:0}.article>aside{border-left:1px solid var(--line);padding-left:1.5rem}.article>aside section{margin-bottom:2rem}.plate{margin:2rem auto;max-width:100%}.plate img{display:block;width:100%;height:auto}.habitat{max-width:56rem}.inline-study{max-width:48rem}.ink-study{mix-blend-mode:multiply}.pixel-study{width:224px}.pixel-study img{image-rendering:pixelated}.specimen-row{display:flex;align-items:center;justify-content:center;gap:1.25rem;flex-wrap:wrap}.specimen{height:10rem;width:auto;flex:0 0 auto}.illustrated-specimen{height:12rem;width:10rem;max-width:100%;flex:0 1 10rem}.illustrated-specimen.crop{height:auto;align-self:center}.specimen img{width:100%;height:100%;object-fit:contain}.pixel-media img{image-rendering:pixelated}.dominance-widget{width:16rem;height:16rem;border:5px double var(--ink);border-radius:50%;margin:1.5rem auto;display:grid;grid-template-columns:1fr 1fr;place-items:center;background:conic-gradient(#111 0 24%,#fcf3e4 24% 48%,#111 48% 71%,#fcf3e4 71%);overflow:hidden}.dominance-medallion{width:4.2rem;height:4.2rem;margin:0}.dominance-medallion img{width:100%;height:100%;object-fit:contain}.study{max-width:52rem}.tilt-a{transform:rotate(-.65deg)}.tilt-b{transform:rotate(-.25deg)}.tilt-c{transform:rotate(.3deg)}.tilt-d{transform:rotate(.7deg)}.crop{overflow:hidden;position:relative}.crop img{position:absolute;max-width:none;width:calc(100% * var(--source-w) / var(--crop-w));left:calc(-100% * var(--x) / var(--crop-w));top:calc(-100% * var(--y) / var(--crop-h))}
.fact{display:grid;grid-template-columns:1.8rem 1fr auto;align-items:center;gap:.55rem;border-bottom:1px solid #342e2540;padding:.45rem 0}.fact-icon{margin:0;width:1.5rem;height:1.5rem}.fact-icon img{width:100%;height:100%;object-fit:contain;filter:brightness(0)}.fact b{font-weight:normal}.related{display:flex;flex-wrap:wrap;gap:.5rem}.related a{color:inherit;font-family:Headline;padding:.4rem .55rem;border:1px solid var(--line);text-decoration:none}.related a:hover{color:var(--paper);background:var(--ink)}dl{display:grid;grid-template-columns:auto 1fr;gap:.25rem .75rem;font-size:.8rem}dd{margin:0;overflow-wrap:anywhere}.review{opacity:.75}.sequence{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:1rem}.step{border-bottom:1px solid var(--line);padding-bottom:1rem}.step-image{margin:.5rem 0}.step-image img{display:block;width:100%}.crop>img{position:absolute!important;max-width:none!important;width:calc(100% * var(--source-w) / var(--crop-w))!important;height:auto!important;left:calc(-100% * var(--x) / var(--crop-w))!important;top:calc(-100% * var(--y) / var(--crop-h))!important}.listing{padding:2.5rem;max-width:90rem}.index-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));gap:1rem}.index-card{display:flex;flex-direction:column;gap:.4rem;color:inherit;text-decoration:none;border-top:2px solid var(--line);padding:1rem}.index-card:hover{background:#fff5}.index-card strong{font:1.3rem Headline}.index-card small{font-family:CodexNote;margin-top:auto}
@media(max-width:900px){body{--page-margin:0;margin:0;display:block}.book-nav{position:static;border:0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);padding:1rem}.book-name{grid-column:1/-1;margin:0}.article{display:block;padding:1.25rem}.article>aside{border-left:0;border-top:1px solid var(--line);padding:0;margin-top:2rem}.listing{padding:1.25rem}}
