@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&display=swap');
:root{--paper:#f8f5eb;--ink:#22291f;--accent:#a34328;--line:#d6d3c5;--green:#273629}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans","Apple SD Gothic Neo","Malgun Gothic",sans-serif;word-break:keep-all}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:.25em}a:focus-visible,input:focus-visible+span{outline:2px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}.wrap{width:min(1180px,calc(100% - 72px));margin:auto}header{border-bottom:1px solid var(--line)}.top,footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:75px}.logo{font-family:"Instrument Serif",Georgia,serif;font-size:34px;white-space:nowrap}.logo span,h1 span,h2 span{color:var(--accent)}nav{display:flex;flex-wrap:wrap;gap:30px;font-size:14px;font-weight:700}.hero{display:grid;grid-template-columns:.88fr 1.12fr;align-items:center;gap:48px;padding:60px 0 42px}.kicker,small{font-size:12px;font-weight:700;letter-spacing:.09em;color:var(--accent)}h1{font-size:clamp(42px,6vw,82px);line-height:1.13;letter-spacing:-.065em;margin:15px 0 22px}.hero p:not(.kicker),.intro p,.lead{font-size:18px;color:#50584b;line-height:1.75}.button{display:inline-flex;align-items:center;gap:30px;padding:14px 20px;margin-top:12px;color:white;background:var(--green);border-radius:4px;font-weight:700}.feature{display:block;position:relative;min-height:410px;overflow:hidden;background:#272d20;color:white}.photo{background:#49362b url('/lacquer.jpg') center/cover no-repeat}.feature .photo{position:absolute;inset:0}.feature::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#111b14e0,transparent 88%)}.feature-copy{position:absolute;z-index:1;left:8%;bottom:11%}.feature-copy small{color:#ffe2bc}.feature h2{font-size:clamp(36px,4.5vw,63px);line-height:1.08;letter-spacing:-.055em;margin:12px 0 20px}.quick{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--line)}.quick a{padding:22px;border-right:1px solid var(--line)}.quick a:first-child{padding-left:0}.quick a:last-child{border:0}.quick b,.quick span{display:block}.quick span{font-size:13px;color:#596152;margin-top:7px}.section{padding:45px 0 70px;min-height:52vh}.section-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px}.section-head h2,.intro h1{font-family:"Instrument Serif",Georgia,serif;font-size:clamp(51px,8vw,90px);font-weight:400;margin:0 0 16px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.card{border-top:1px solid var(--line);padding:20px 0}.card h3{font-size:21px;line-height:1.45;margin:8px 0}.card p,.reading p{line-height:1.85}.card p,.notice{color:#50584b}.reading{width:min(720px,calc(100% - 42px));margin:50px auto 70px}.reading h1{font-size:clamp(36px,6vw,60px)}.reading h2{font-size:24px;margin-top:34px}.reading .kicker{margin-top:28px}.reading aside,.notice{padding:18px;background:#eee9dc}.article-photo{aspect-ratio:2/1;margin:26px 0}fieldset{border:0;padding:0;margin:0 0 14px;display:flex;gap:8px;flex-wrap:wrap}legend{font-size:13px;font-weight:700;margin-bottom:8px}fieldset input{position:absolute;opacity:0}fieldset span{display:inline-block;padding:8px 12px;border:1px solid var(--line);border-radius:24px;cursor:pointer;font-size:14px}fieldset input:checked+span{background:var(--green);color:white}form{margin:28px 0}footer{border-top:1px solid var(--line)}footer .wrap>a:last-child{font-size:14px}
@media(max-width:760px){.wrap{width:calc(100% - 36px)}.top{align-items:flex-start;flex-direction:column;gap:8px;padding:14px 0}nav{gap:15px;font-size:13px}.hero{grid-template-columns:1fr;gap:25px;padding-top:30px}.feature{min-height:330px}.grid{grid-template-columns:1fr;gap:0}.quick a{padding:14px 8px}.quick b{font-size:14px}.quick span{font-size:11px}.section{padding:35px 0}.logo{font-size:27px}}
:root{color-scheme:light;--muted:#50584b;--surface:#eee9dc;--control:#273629;--control-text:#fff}
:root[data-theme=dark]{color-scheme:dark;--paper:#171b18;--ink:#e8e8db;--accent:#f0a389;--line:#3c463e;--muted:#c2c9bd;--surface:#232c25;--control:#bcd5bd;--control-text:#17261a}
.logo{display:inline-flex;align-items:center}
.logo img{width:174px;height:auto;display:block}
.logo img.logo-dark,.logo-dark{display:none}
[data-theme=dark] .logo img.logo-light{display:none}
[data-theme=dark] .logo img.logo-dark{display:block}
.top nav{align-items:center}
#theme{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:7px 12px;cursor:pointer}
#theme:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
#theme[aria-pressed=true]{border-color:var(--accent)}
.feature,.article-photo,.legacy-photo{border-radius:24px}
.button{border-radius:999px;background:var(--control);color:var(--control-text)}
.hero p:not(.kicker),.intro p,.lead,.quick span,.card p,.notice{color:var(--muted)}
.quick{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--surface)}
.quick a:first-child{padding-left:22px}
.card{border:1px solid var(--line);border-radius:20px;padding:20px}
.notice,.reading aside,.examples{background:var(--surface);border-radius:20px}
fieldset input:checked+span{background:var(--control);color:var(--control-text)}
.reading aside a,.reading p a{text-decoration:underline;text-underline-offset:.18em}
.examples{padding:6px 22px 20px;margin:32px 0}.examples ul{padding:0;list-style:none;margin:0}.examples li{border-top:1px solid var(--line);padding:13px 0;line-height:1.55}.examples strong,.examples span{display:block}.examples span{color:var(--muted);margin-top:3px}
.legacy-photo{display:block;width:100%;height:auto;margin:24px 0}
@media(max-width:760px){.logo img{width:140px}.top nav{gap:11px}.grid{gap:12px}.quick a:first-child{padding-left:10px}}
#theme{display:inline-grid;place-items:center;width:44px;height:44px;padding:0;font:24px/1 system-ui,sans-serif}
#theme .theme-sun,[data-theme=dark] #theme .theme-moon{display:none}
[data-theme=dark] #theme .theme-sun{display:block}
.inline-examples{margin:12px 0 30px;padding:2px 18px}
.inline-examples li:first-child{border-top:0}
:root{--summary-bg:#e5eee0;--summary-border:#a9bda3}
[data-theme=dark]{--summary-bg:#293b30;--summary-border:#55765e}
.translation-summary{margin:0 0 28px;padding:18px 22px;border:1px solid var(--summary-border);border-radius:20px;background:var(--summary-bg)}
.reading .translation-summary h2{margin:0 0 10px;font-size:19px;line-height:1.45}
.translation-summary ol{margin:0;padding-inline-start:1.4em}
.translation-summary li{padding:5px 0 5px 4px;line-height:1.55}
.translation-summary li::marker{color:var(--accent);font-weight:700}
.translation-summary li span{display:block;color:var(--muted)}

.gama-photo{max-width:500px;margin-inline:auto}
.imported-content img{display:block;max-width:100%;height:auto;border-radius:16px}
.imported-content figure{margin:24px 0}
.imported-content table{display:block;max-width:100%;overflow-x:auto;border-collapse:collapse}
.imported-content td,.imported-content th{padding:8px 12px;border:1px solid var(--line)}
.imported-content a,.archive-list a{text-decoration:underline;text-underline-offset:.2em}
.archive-list{columns:2;padding-inline-start:24px}.archive-list li{break-inside:avoid;margin-bottom:12px}
@media(max-width:640px){.archive-list{columns:1}}
.book-details dl{margin:0}
.book-details dl div{display:grid;grid-template-columns:6em minmax(0,1fr);gap:12px;padding:8px 0;border-bottom:1px solid var(--summary-border)}
.book-details dt{font-weight:700}
.book-details dd{margin:0;color:var(--muted)}
.imported-content .book-details .button{text-decoration:none}
.archive-search{display:grid;gap:8px;max-width:390px;font-weight:700;margin:20px 0}
.archive-search input{font:inherit;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:14px;padding:11px 14px}
.archive-search input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

#theme{appearance:none;-webkit-appearance:none;flex:none;touch-action:manipulation;color:var(--muted)}
#theme:hover{color:var(--ink);border-color:var(--accent)}
#theme .theme-moon,#theme .theme-sun{position:relative;width:20px;height:20px}
.theme-moon::before,.theme-moon::after,.theme-sun::before,.theme-sun::after{content:"";position:absolute;box-sizing:border-box}
.theme-moon::before{inset:2px;border:1.5px solid currentColor;border-radius:50%}
.theme-moon::after{top:0;right:0;width:13px;height:13px;border-radius:50%;background:var(--surface);border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
.theme-sun::before{inset:5px;border:1.5px solid currentColor;border-radius:50%}
.theme-sun::after{top:9px;left:9px;width:2px;height:2px;box-shadow:0 -9px,0 9px,9px 0,-9px 0,6px 6px,-6px -6px,-6px 6px,6px -6px;border-radius:50%}
@media(max-width:1024px){.top nav{column-gap:14px}}

.card-thumbnail {
  display: block;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  margin-bottom: 14px;
  border-radius: 12px;
  background: var(--line);
}
.card-thumbnail img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.feature-copy { right: 8%; }
.feature h2 { font-size: clamp(30px, 4vw, 54px); overflow-wrap: anywhere; }

.book-filter-row { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 24px; }
.book-filter-row label { font-weight: 700; }
.book-filter-row select {
  display: block;
  margin-top: 6px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  color: var(--ink);
  padding: 9px 12px;
  font: inherit;
}

[data-book] {
    display: grid;
    grid-template-columns: clamp(74px, 10vw, 112px) minmax(0, 1fr);
    column-gap: 14px;
    align-content: start;
    align-items: start;
}
[data-book][hidden] { display: none; }
[data-book] h3 { margin-block: 6px; }
[data-book] p { margin-block: 0 8px; }
.book-thumbnail {
    grid-row: 1 / span 4;
    display: block;
    aspect-ratio: 2 / 3;
    border-radius: 10px;
    overflow: hidden;
    background: var(--surface);
}
.book-thumbnail img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.book-purchase { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.book-purchase .button { margin: 0; }
.reading .affiliate-note { margin: 8px 0 0; color: var(--muted); font-size: .84rem; }
.imported-content .book-purchase .button { text-decoration: none; }

.work-quote { margin-inline: 0; padding: 12px 18px; }
.work-quote figcaption { color: var(--muted); font-size: .87rem; }
.work-quote blockquote { margin: 8px 0 4px; font-weight: 700; }
.reading .work-quote p { margin: 0; }

.poem-text blockquote { font-weight: 400; }
.reading .poem-text blockquote p + p { margin-top: 1em; }

#column-count { color: var(--muted); margin: 0 0 16px; scroll-margin-top: 20px; }
.column-pagination { justify-content: center; align-items: center; gap: 6px; margin: 28px 0 0; }
.column-pagination button {
  min-width: 36px;
  min-height: 38px;
  padding: 6px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--ink);
  font: inherit;
  cursor: pointer;
}
.column-pagination button[aria-current="page"] { background: var(--control); color: var(--control-text); }
.column-pagination button:disabled { opacity: .45; cursor: default; }
.column-pagination button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

#featured-column .photo { background-image: none; }

.reading-level { background: var(--surface); border-color: var(--line); }
.reading .reading-level p { margin: 12px 0 0; }
.reading .reading-level-note { color: var(--muted); font-size: .88rem; }
