/* confabulations — dark only, warm black, one accent (amber), Ulysses-adjacent */

:root{
  --bg:#1a1918;
  --bg2:#1e1d1b;
  --ink:#dedcd5;
  --ink2:#9a998f;
  --faint:#636259;
  --line:#2d2c29;
  --line2:#262523;
  --hi:#ffffff;
  --accent:#d49f35;  /* the only colour: “” mark, 未公開 badge, hover */
  --sans:"IBM Plex Sans JP","Noto Sans JP",system-ui,sans-serif;
  --mono:"Space Mono",ui-monospace,monospace;
  --display:"Space Grotesk","IBM Plex Sans JP",sans-serif;
  --quote:"IBM Plex Serif",Georgia,serif;
  --measure:40rem;

  /* type scale — five steps only */
  --fs-xs:.75rem;    /* mono meta: nav, labels, dates, links */
  --fs-s:.875rem;    /* secondary sans: crumbs, chapter-nav titles */
  --fs-base:1rem;    /* body text, wordmark */
  --fs-m:1.125rem;   /* list titles */
  --fs-l:1.5rem;     /* page titles */
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--sans);font-size:var(--fs-base);font-weight:400;line-height:1.95;
  -webkit-font-smoothing:antialiased;font-feature-settings:"palt" 1;
  transition:background .2s ease,color .2s ease;}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:840px;margin:0 auto;padding:0 28px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* slim bar */
.bar{border-bottom:1px solid var(--line2)}
.bar .wrap{display:flex;align-items:center;justify-content:space-between;height:60px}
.wordmark{display:inline-flex;align-items:baseline;gap:.5em;font-family:var(--display);font-weight:700;font-size:var(--fs-base);letter-spacing:0;color:var(--ink)}
.wordmark .q{font-family:var(--quote);font-weight:700;font-size:var(--fs-m);line-height:1;letter-spacing:.04em;color:var(--accent)}
.navr{display:flex;align-items:center;gap:22px}
.navr a{font-family:var(--mono);font-size:var(--fs-xs);color:var(--ink2);letter-spacing:.05em}
.navr a:hover{color:var(--ink)}

/* masthead = four lines only (name lives in the top bar) */
.mast{padding:24px 0 24px;border-bottom:1px solid var(--line2)}
.creed{font-family:var(--mono);font-size:var(--fs-xs);line-height:1.8;letter-spacing:.01em;color:var(--ink2);margin:0}
.creed span{display:inline-block;white-space:nowrap;margin-right:.9em}
.creed span:last-child{margin-right:0}

/* section label */
.lbl{font-family:var(--mono);font-size:var(--fs-xs);font-weight:700;letter-spacing:.22em;
  color:var(--faint);margin:0 0 20px;display:flex;align-items:center;gap:16px}
.lbl::after{content:"";flex:1;height:1px;background:var(--line)}
.sec{padding:54px 0 0}
.empty{color:var(--faint);font-family:var(--mono);font-size:var(--fs-xs);padding:6px 0 10px}

/* members-only (awaiting review) marker — visible only to signed-in members */
.draft{display:inline-block;vertical-align:middle;margin-left:.7em;padding:1px 7px;
  font-family:var(--mono);font-size:var(--fs-xs);font-weight:400;letter-spacing:.06em;line-height:1.6;
  color:var(--accent);border:1px solid rgba(212,159,53,.55);border-radius:4px}

/* novel = list of works */
.work{display:block;padding:22px 0;border-top:1px solid var(--line2)}
.work:first-of-type{border-top:none}
.work h2{font-weight:500;font-size:var(--fs-base);line-height:1.5;margin:0 0 6px;letter-spacing:.02em;transition:color .2s}
.work:hover h2{color:var(--accent)}
.work .m{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint);letter-spacing:.03em;margin:0}

/* essay = flat chronological */
.row{display:grid;grid-template-columns:6.5rem 1fr;gap:26px;align-items:baseline;
  padding:20px 0;border-top:1px solid var(--line2)}
.row:first-of-type{border-top:none}
.row .date{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint);letter-spacing:.02em}
.row h3{font-weight:500;font-size:var(--fs-base);line-height:1.55;margin:0;letter-spacing:.02em;transition:color .2s}
.row:hover h3{color:var(--accent)}

/* work (tag) page */
.workhead{padding:76px 0 10px;border-bottom:1px solid var(--line2)}
.workhead .crumb{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint);letter-spacing:.06em;margin:0 0 12px}
.workhead h1{font-weight:600;font-size:var(--fs-l);line-height:1.45;margin:0 0 12px;letter-spacing:.02em}
.workhead .m{font-family:var(--mono);font-size:var(--fs-xs);color:var(--ink2);letter-spacing:.03em;margin:0}
.chaplist{padding:18px 0 0}
.chap{display:grid;grid-template-columns:1fr 7rem;gap:20px;align-items:baseline;
  padding:20px 0;border-top:1px solid var(--line2)}
.chap:first-of-type{border-top:none}
.chap h3{font-weight:500;font-size:var(--fs-base);line-height:1.5;margin:0;letter-spacing:.02em;transition:color .2s}
.chap:hover h3{color:var(--accent)}
.chap .d{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint);text-align:right}

/* reading view */
.reader{background:var(--bg2);border-top:1px solid var(--line)}
.progress{position:sticky;top:0;height:2px;background:transparent;z-index:5}
.progbar{display:block;height:2px;width:0;background:var(--ink2);opacity:.5}
.article{max-width:var(--measure);margin:0 auto;padding:76px 28px 60px;font-feature-settings:"palt" 0}
.article .crumb{font-family:var(--sans);font-size:var(--fs-s);letter-spacing:.02em;color:var(--ink2);margin:0 0 10px}
.article h1{font-weight:600;font-size:var(--fs-l);line-height:1.5;margin:0 0 10px;letter-spacing:.02em}
.article .date{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint);letter-spacing:.04em;margin-bottom:52px}
.content{font-size:var(--fs-base);line-height:2.1;letter-spacing:.02em;color:var(--ink);font-weight:400;
  text-align:justify;text-justify:inter-character;line-break:strict;word-break:normal}
.content p{margin:0 0 1.9em}
.content h2,.content h3{font-weight:700;font-size:var(--fs-m);line-height:1.6;margin:2em 0 .8em}
.content blockquote{border-left:2px solid var(--line);margin:1.6em 0;padding:0 0 0 1.2em;color:var(--ink2)}
.content hr{border:none;text-align:center;margin:2.6em 0}
.content hr::before{content:"＊";color:var(--faint);letter-spacing:.8em;font-size:var(--fs-s)}
.content a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--faint)}
.content img{margin:2em auto;border-radius:4px}
.content figcaption{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint);text-align:center;margin-top:.6em}

/* Koenig editor card widths (required) */
.kg-width-wide{position:relative;width:75vw;max-width:980px;margin-left:50%;transform:translateX(-50%)}
.kg-width-full{position:relative;width:100vw;max-width:100vw;margin-left:50%;transform:translateX(-50%)}
.kg-width-full img{border-radius:0}
figure.kg-card{margin:2em 0}
.kg-embed-card{display:flex;justify-content:center}

.chapnav{display:flex;justify-content:space-between;gap:20px;margin-top:72px;
  border-top:1px solid var(--line);padding-top:30px;font-family:var(--mono)}
.chapnav a{flex:1}
.chapnav .l{font-size:var(--fs-xs);letter-spacing:.12em;color:var(--faint);display:block;margin:0 0 6px}
.chapnav .t{font-family:var(--sans);font-weight:500;color:var(--ink);font-size:var(--fs-s);line-height:1.5}
.chapnav .next{text-align:right}
.chapnav .disabled{opacity:.3;pointer-events:none}
.toworks{text-align:center;margin-top:28px}
.toworks a{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint);letter-spacing:.06em}
.toworks a:hover{color:var(--ink)}

footer{border-top:1px solid var(--line);padding:34px 0 48px}
.footlinks{display:flex;justify-content:center;gap:26px}
.footlinks a{font-family:var(--mono);font-size:var(--fs-xs);letter-spacing:.12em;color:var(--faint)}
.footlinks a:hover{color:var(--ink)}

@media(max-width:620px){
  :root{
    --fs-base:.9375rem;
    --fs-m:1.0625rem;
    --fs-l:1.25rem;
  }
  .row{grid-template-columns:1fr;gap:4px}
  .row .date{order:2}
  .chap{grid-template-columns:1fr;gap:4px}
  .chap .d{text-align:left}
  .mast{padding:18px 0 18px}
  .workhead{padding:54px 0 10px}
  .article{padding:54px 22px 56px}
  .content{line-height:2.0}
}
