/* Notes. Inherits every token and the header/footer from site.css; this file
   only sets the reading column, because a 1,200 word argument needs different
   measure and rhythm from a landing page. */

.n-wrap{max-width:46rem}
.note, .note-index{padding:clamp(56px,9vw,112px) 0 clamp(64px,10vw,128px)}

.n-back{font-family:var(--mono);font-size:.78rem;letter-spacing:.17em;text-transform:uppercase;
        margin:0 0 1.6rem}
.n-back a{color:var(--ink-3);text-decoration:none;border-bottom:1px solid var(--rule-2)}
.n-back a:hover{color:var(--accent-text)}

.n-kicker{font-family:var(--mono);font-size:.78rem;letter-spacing:.17em;text-transform:uppercase;
          color:var(--accent-text);margin:0 0 .7rem}
.n-title{font-family:var(--display);font-variation-settings:"SOFT" 0,"WONK" 0,"opsz" 120;
         font-weight:600;font-size:clamp(2.1rem,5.2vw,3.3rem);line-height:1.08;
         letter-spacing:-.018em;color:var(--deep);margin:0 0 1rem;text-wrap:balance}
.n-standfirst{font-size:clamp(1.05rem,2.1vw,1.28rem);line-height:1.55;color:var(--ink-2);
              margin:0 0 1.1rem;max-width:36rem}
.n-meta{font-family:var(--mono);font-size:.76rem;letter-spacing:.1em;color:var(--ink-3);
        margin:0 0 2.4rem;padding-bottom:1.6rem;border-bottom:1px solid var(--rule)}

.n-body{font-size:1.06rem;line-height:1.72;color:var(--ink-2)}
.n-body p{margin:0 0 1.15rem}
.n-body h2{font-family:var(--display);font-variation-settings:"SOFT" 0,"WONK" 0;font-weight:600;
           font-size:clamp(1.35rem,3vw,1.72rem);line-height:1.2;letter-spacing:-.012em;
           color:var(--deep);margin:2.5rem 0 .85rem;text-wrap:balance}
.n-body h3{font-family:var(--sans);font-weight:600;font-size:1.06rem;color:var(--deep);
           margin:1.9rem 0 .5rem}
.n-body strong{color:var(--deep);font-weight:600}
.n-body a{color:var(--accent-text);text-decoration:none;border-bottom:1px solid var(--rule-2)}
.n-body a:hover{border-bottom-color:var(--accent)}
.n-body ul{list-style:none;margin:0 0 1.3rem;padding:0}
.n-body li{position:relative;padding-left:1.4rem;margin-bottom:.5rem}
.n-body li:before{content:"";position:absolute;left:0;top:.78em;width:.6rem;height:1px;
                  background:var(--accent)}
.n-body blockquote{margin:1.7rem 0;padding:0 0 0 1.4rem;border-left:2px solid var(--accent)}
.n-body blockquote p{font-family:var(--display);font-variation-settings:"SOFT" 0,"WONK" 0;
                     font-weight:500;font-size:1.22rem;line-height:1.45;color:var(--deep);margin:0}
.n-body code{font-family:var(--mono);font-size:.9em;color:var(--deep)}
.n-rule{border:0;height:1px;background:var(--rule);margin:2.2rem 0}

.n-end{margin-top:3rem;padding-top:1.6rem;border-top:1px solid var(--rule);
       font-size:1rem;color:var(--ink-2)}
.n-end a{color:var(--accent-text);text-decoration:none;border-bottom:1px solid var(--rule-2)}
.n-end a:hover{border-bottom-color:var(--accent)}
.n-back2{font-family:var(--mono);font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;
         margin-top:1.1rem;color:var(--ink-3)}

/* index */
.n-list{display:flex;flex-direction:column;gap:0;margin-top:2.4rem;
        border-top:1px solid var(--rule)}
.n-card{display:grid;grid-template-columns:1fr;gap:.35rem;padding:1.9rem 0;
        border-bottom:1px solid var(--rule);text-decoration:none}
.n-card-kicker{font-family:var(--mono);font-size:.72rem;letter-spacing:.17em;
               text-transform:uppercase;color:var(--accent-text)}
.n-card-title{font-family:var(--display);font-variation-settings:"SOFT" 0,"WONK" 0;
              font-weight:600;font-size:clamp(1.3rem,3vw,1.62rem);line-height:1.18;
              letter-spacing:-.012em;color:var(--deep)}
.n-card:hover .n-card-title{color:var(--accent-hi)}
.n-card-desc{color:var(--ink-2);line-height:1.55;max-width:34rem}
.n-card-date{font-family:var(--mono);font-size:.74rem;letter-spacing:.1em;color:var(--ink-3);
             margin-top:.25rem}