*{box-sizing:border-box;margin:0}
:root{
  --bg:#0B131D;--ink:#DCE7F0;--mute:#8296A8;--amb:#E9C48A;--line:#2A4054;--ice:#9DBAD0;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
html{background:var(--bg);scroll-padding-top:env(safe-area-inset-top,0px);-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:"Cormorant Garamond","Iowan Old Style",Georgia,serif}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0;text-align:inherit}
a:focus-visible,button:focus-visible{outline:2px solid var(--amb);outline-offset:3px;border-radius:2px}

.site{
  position:relative;overflow:hidden;display:flex;flex-direction:column;touch-action:pan-y pinch-zoom;
  min-height:100vh;min-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));
  background:radial-gradient(120% 90% at 50% -10%,#1A2B40 0%,#0E1722 55%,#080E15 100%);
}
.site::after{content:"";position:absolute;left:0;right:0;bottom:0;height:8rem;background:linear-gradient(0deg,rgba(220,232,242,.08),transparent);pointer-events:none}
#swap{display:contents}
#snow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.flake{stroke:currentColor;fill:none;stroke-width:1;stroke-linecap:round;stroke-linejoin:round}
.frost{position:absolute;top:-9rem;right:-9rem;width:26rem;height:26rem;color:#5E84A3;opacity:.16;pointer-events:none}

.head{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;padding:1.5rem clamp(1.5rem,5vw,3rem)}
.word{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:.6rem;font-style:italic;font-weight:300;font-size:1.4rem}
.word svg{width:1.05rem;height:1.05rem;color:var(--ice)}
.arch{display:none;font-size:1.15rem;color:var(--mute);border-bottom:1px solid transparent}
.js .arch{display:inline-block}
.arch:hover,.arch[aria-expanded="true"]{color:var(--ink);border-color:var(--line)}

.archive{position:relative;z-index:1;margin:0 clamp(1.5rem,5vw,3rem);padding:.5rem 0 1rem;border-top:1px solid var(--line);max-height:45vh;overflow-y:auto}
.js .archive{display:none}
.js .archive.open{display:block}
.archive ul{list-style:none;padding:0;max-width:36rem}
.archive a{display:grid;grid-template-columns:8.5rem 1fr;padding:.35rem 0;font-size:.95rem;color:var(--mute);text-decoration:none}
.archive a:hover,.archive a[aria-current="true"]{color:var(--ink)}
.archive a[aria-current="true"] span:first-child{color:var(--amb)}

.main{position:relative;z-index:1;flex:1;width:100%;max-width:46rem;padding:clamp(1.5rem,5vh,3rem) clamp(1.5rem,5vw,3rem) 3rem clamp(1.5rem,14vw,10rem)}
.nav{display:flex;gap:2rem;margin-bottom:2.5rem;font-size:1.15rem}
.nav a,.nav span{color:var(--mute);text-decoration:none;border-bottom:1px solid transparent}
.nav a:hover{color:var(--ink);border-color:var(--line)}
.nav .off{opacity:.3}
.date{font-size:1.05rem;font-style:italic;color:var(--amb)}
.title{font-size:1.1rem;font-weight:400;margin:.3rem 0 2.25rem;color:var(--mute)}
.poem{font-weight:700;font-size:clamp(1.1rem,3.6vw,1.4rem);line-height:1.5}
.poem p+p{margin-top:1.5em}
.main:not(.about) .date + .poem{margin-top:3.25rem}
.about .date{margin-bottom:2.25rem}
.about-text{font-size:clamp(1.05rem,3.4vw,1.3rem)}
.plain{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line)}
.ln{display:block;animation:breathe 1.1s ease both;animation-delay:calc(var(--i) * 90ms)}
@keyframes breathe{from{opacity:0;filter:blur(3px)}to{opacity:1;filter:none}}
@media (prefers-reduced-motion:reduce){.ln{animation:none}}

.foot{position:relative;z-index:1;padding:1rem clamp(1.5rem,5vw,3rem) 2rem clamp(1.5rem,14vw,10rem);font-size:1.05rem}
.foot a{color:var(--mute);text-decoration:none;border-bottom:1px solid transparent}
.foot a:hover{color:var(--ink);border-color:var(--line)}
