@font-face{
  font-family: Held;
  src: url("/fonts/petrona.woff2") format("woff2-variations"), url("/fonts/petrona.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family: Held;
  src: url("/fonts/petrona-latin-ext.woff2") format("woff2-variations"), url("/fonts/petrona-latin-ext.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
:root{
  --paper:#E7E2DC;
  --tray:#F3EFEA;
  --wrap:#DDD6CF;
  --ink:#1C1814;
  --mute:#6A635C;
  --lamp:#B5562A;
  --star:#A56B2A;
  --focus: 0 0 0 3px #E7E2DC, 0 0 0 6px #B5562A;
  --in: cubic-bezier(0.22, 1, 0.36, 1);
  --out: cubic-bezier(0.32, 0.72, 0, 1);
}
*{box-sizing:border-box;margin:0}
html,body{background:var(--paper);color:var(--ink);font-family:Held,Georgia,serif}
html{font-size:16px;-webkit-text-size-adjust:100%;scroll-padding-top:16px}
body{font-weight:450;font-size:18px;line-height:1.45;min-height:100vh;font-variant-numeric:tabular-nums}
img,svg{display:block;max-width:100%}
a{color:var(--lamp);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
button,input,textarea,select{font:inherit;color:inherit;border:0;background:none}
button{cursor:pointer}
:focus{outline:none}
:focus-visible{box-shadow:var(--focus)}
.skip{position:absolute;left:-999px;top:0}
.skip:focus{left:12px;top:12px;z-index:40;background:var(--tray);padding:10px 14px;border-radius:12px;color:var(--ink)}
.wrap{width:min(760px,calc(100% - 32px));margin:0 auto}
.top{display:flex;align-items:center;justify-content:space-between;gap:8px 16px;padding:16px 0 0}
.mark{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;min-height:44px}
.mark:hover{text-decoration:none}
.mark svg{width:36px;height:36px;flex:none}
.mark span{font-weight:700;font-size:22px;letter-spacing:-0.02em}
.top a.sg{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);font-size:16px;font-weight:550}
.hero{padding:18px 0 8px}
.hero .lamp{width:72px;height:72px;margin:0 0 14px;color:var(--ink)}
.hero .lamp .shade{fill:var(--wrap);transition:fill 240ms var(--out)}
.hero.is-lit .lamp .shade{fill:var(--lamp)}
.hero h1{font-size:clamp(40px,9vw,72px);font-weight:700;line-height:0.98;letter-spacing:-0.02em}
.hero .lede{margin-top:12px;font-size:18px;font-weight:450;line-height:1.45;max-width:24em;color:var(--ink)}
.hero.sm{padding:10px 0 8px}
.hero.sm h1{font-size:clamp(32px,8vw,48px)}
.crumb{font-size:15px;font-weight:550;margin-bottom:8px}
.crumb a{color:var(--mute)}

/* compact filter row */
.stick{display:flex;align-items:center;gap:4px 8px;margin:8px 0 14px;min-height:44px}
.icon{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex:none;border-radius:12px;color:var(--ink)}
.icon:hover{background:var(--tray)}
.find{display:flex;align-items:center;flex:none;min-width:44px;border-radius:12px}
.find .search{display:flex;align-items:center;width:0;min-width:0;opacity:0;overflow:hidden;pointer-events:none}
.find #q{width:100%;min-width:0;min-height:44px;background:transparent;padding:8px 4px}
.find #q::-webkit-search-decoration,.find #q::-webkit-search-cancel-button{display:none}
.find #q:focus,.find #q:focus-visible{box-shadow:none}
.find .find-clear{opacity:0;pointer-events:none}
.find.is-open{flex:1 1 160px;max-width:280px;background:var(--tray)}
.find.is-open .search{flex:1 1 auto;width:auto;opacity:1;pointer-events:auto;overflow:visible}
.find.is-open .find-clear{opacity:1;pointer-events:auto}
.find.is-open .find-btn:hover{background:transparent}
.filt-open{
  display:none;align-items:center;min-height:44px;padding:0 12px;border-radius:12px;
  font-size:16px;font-weight:550;color:var(--mute);margin-left:auto;
}
.filt-open.is-on{color:var(--lamp)}
@media(min-width:720px){
  .find{order:1;margin-left:auto}
  .filt-pop{order:0}
}
.filt-veil,.filt-done{display:none}
.filt-pop{flex:1 1 auto;min-width:0}
.filt-card{display:contents}
.sent{
  display:flex;flex-wrap:nowrap;align-items:center;gap:0 0.3em;margin:0;
  color:var(--mute);font-size:16px;font-weight:450;min-width:0;line-height:1.2;white-space:nowrap;
}
.sel{position:relative;display:inline-flex;vertical-align:middle}
.sel-btn{
  display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 4px;
  font-size:16px;font-weight:650;color:var(--ink);border-radius:12px;
}
.sel-btn::after{
  content:"";width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;
  border-top:5px solid var(--mute);translate:0 1px;transition:transform 180ms var(--out);
}
.sel.is-open .sel-btn::after{transform:rotate(180deg)}
.sel-list{
  position:absolute;z-index:20;top:calc(100% - 2px);left:0;min-width:max(100%, 12em);
  margin:0;padding:6px;list-style:none;background:var(--tray);border-radius:12px;
  transform-origin:top left;animation:sel-in 180ms var(--out) both;
}
@keyframes sel-in{from{opacity:0;transform:scale(0.96)}to{opacity:1;transform:none}}
.sel-list[hidden]{display:none}
.sel-list [role="option"]{
  display:flex;align-items:center;min-height:44px;padding:0 12px;border-radius:10px;
  font-size:16px;font-weight:550;color:var(--ink);cursor:pointer;
}
.sel-list [role="option"]:hover,.sel-list [role="option"]:focus{background:var(--wrap);outline:none}
.sel-list [role="option"][aria-selected="true"]{color:var(--lamp)}
@media(max-width:719px){
  .filt-open{display:inline-flex}
  .stick.is-searching .filt-open{display:none}
  .find.is-open{max-width:none}
  .filt-pop{display:none;flex:none}
  .filt-pop.is-open{display:block;position:fixed;inset:0;z-index:30}
  .filt-pop.is-open .filt-veil{
    display:block;position:absolute;inset:0;width:100%;height:100%;padding:0;
    background:rgba(28,24,20,0.35);cursor:pointer;animation:fade 200ms var(--out);
  }
  .filt-pop.is-open .filt-card{
    display:block;position:absolute;left:0;right:0;bottom:0;
    background:var(--tray);border-radius:20px 20px 0 0;padding:22px 20px 28px;
    animation:up 280ms var(--out);
  }
  .filt-pop.is-open .sent{flex-direction:column;flex-wrap:wrap;align-items:stretch;gap:10px;font-size:16px;white-space:normal}
  .filt-pop.is-open .sel{display:block}
  .filt-pop.is-open .sel-btn{
    width:100%;justify-content:space-between;background:var(--paper);padding:0 14px;
  }
  .filt-pop.is-open .sel-list{position:static;min-width:0;margin-top:6px;background:var(--paper);animation:none}
  .filt-done{
    display:inline-flex;align-items:center;justify-content:center;
    min-height:48px;margin-top:16px;width:100%;border-radius:12px;
    background:var(--ink);color:var(--tray);font-weight:650;
  }
  .filt-done:active{transform:scale(0.97)}
}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes up{from{transform:translateY(16px);opacity:0}to{transform:none;opacity:1}}

/* linen tray + night log rows */
.tray{background:var(--tray);border-radius:16px;padding:6px 0;margin:0 0 28px}
.rows{list-style:none;margin:0;padding:0}
.row{display:block}
.row[hidden]{display:none}
.open{
  display:grid;grid-template-columns:40px 1fr auto;align-items:center;gap:12px;
  width:100%;min-height:56px;padding:8px 16px;text-align:left;border-radius:12px;color:var(--ink);
}
.open:hover{background:var(--paper)}
.open:active{transform:scale(0.97)}
.logo{width:40px;height:40px;border-radius:10px;background:var(--paper);object-fit:contain}
.idline{display:flex;align-items:center;gap:8px;min-width:0}
.nm{font-weight:650;font-size:17px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal}
.star{width:14px;height:14px;flex:none}
.dot{width:7px;height:7px;border-radius:50%;background:var(--lamp);flex:none}
.at{font-size:13px;font-weight:550;color:var(--mute);white-space:nowrap;padding-left:4px}
.seo{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.empty{padding:20px 16px 28px;color:var(--mute)}
.cnt{position:absolute;left:-9999px}

.row{animation:settle 220ms var(--out) both;animation-delay:calc(var(--i, 0) * 24ms)}
@keyframes settle{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* sheet */
.shade{position:fixed;inset:0;z-index:40;background:rgba(28,24,20,0.35);animation:fade 200ms var(--out)}
.sheet{
  position:fixed;z-index:41;left:0;right:0;bottom:0;max-height:min(86vh, 720px);
  overflow:auto;background:var(--tray);border-radius:20px 20px 0 0;padding:20px 20px 32px;
  animation:up 280ms var(--out);
}
@media(min-width:720px){
  .sheet{left:50%;right:auto;bottom:auto;top:50%;width:min(520px, calc(100% - 48px));
    transform:translate(-50%,-50%);border-radius:20px;max-height:min(80vh, 680px);animation:pop 220ms var(--out)}
  @keyframes pop{from{opacity:0;transform:translate(-50%,-48%) scale(0.98)}to{opacity:1;transform:translate(-50%,-50%)}}
}
.sheet .x{
  position:absolute;top:10px;right:10px;width:44px;height:44px;border-radius:12px;color:var(--ink);
  display:inline-flex;align-items:center;justify-content:center;
}
.sheet .x:hover{background:var(--paper)}
.sheet .hd{display:flex;align-items:center;gap:14px;padding-right:48px;margin-bottom:12px}
.sheet .hd img{width:48px;height:48px;border-radius:12px;background:var(--paper)}
.sheet h2{font-size:clamp(26px,5vw,32px);font-weight:650;line-height:1.15;letter-spacing:-0.02em}
.sheet .tag{display:inline-block;margin-top:4px;font-size:14px;font-weight:550;color:var(--mute)}
.sheet .ds{margin:8px 0 14px;font-size:18px;line-height:1.45}
.sheet .fx{margin:0 0 16px;font-size:15px;font-weight:550;color:var(--mute)}
.sheet .go{
  display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;
  border-radius:12px;background:var(--ink);color:var(--tray);font-weight:650;
}
.sheet .go:hover{text-decoration:none}
.sheet .go:active{transform:scale(0.97)}

/* forms, footer */
.news,.prose,.sug{padding:8px 0 28px}
.news h2,.sug h2,.prose h2{font-size:26px;font-weight:650;letter-spacing:-0.02em;margin-bottom:8px}
.news p,.sug p,.prose p{margin:0 0 12px;max-width:32em}
.prose{max-width:36em}
.sub,.sugform{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch}
.in,textarea.in{
  flex:1 1 200px;min-height:48px;padding:0 16px;border-radius:12px;background:var(--tray);
}
textarea.in{padding:12px 16px;min-height:96px;resize:vertical}
.btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;
  border-radius:12px;background:var(--lamp);color:#fff;font-weight:650;
}
.btn:active{transform:scale(0.97)}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}
.err{color:var(--lamp);font-size:15px;font-weight:550;min-height:1.2em;flex:1 1 100%}
.ok{font-weight:550}
.foot{background:var(--wrap);padding:32px 0 48px;margin-top:8px}
.foot .wrap{display:grid;gap:22px}
.foot h2{font-size:15px;font-weight:650;margin-bottom:8px}
.foot ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px 16px}
.foot li a{color:var(--ink);min-height:44px;display:inline-flex;align-items:center;font-weight:550}
.foot p{font-size:15px;color:var(--mute);max-width:36em;margin:0 0 8px}
.foot p a{color:var(--ink)}
.toastm{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:var(--ink);color:var(--tray);
  padding:12px 18px;border-radius:12px;z-index:50;font-weight:550;display:none}
.toastm.is-on{display:block;animation:up 200ms var(--out)}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .hero .lamp .shade{fill:var(--lamp)}
}