/* Hakikat Books — v2 editorial design */
:root{
 --paper:#F7F4ED;--paper2:#EFEAE0;--sage:#E6ECE4;--card:#FFFDF8;
 --ink:#202D2A;--ink2:#4A5753;--muted:#5E6A66;--line:#DCD5C7;--line2:#E8E2D6;
 --green:#163F35;--green2:#1F5446;--brass:#8C6B3A;--brass-l:#A4824F;--clay:#A85F47;
 --on-green:#F7F4ED;
 --serif:"Noto Serif",Georgia,"Times New Roman",serif;
 --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",Arial,sans-serif;
 --ar-serif:"Noto Naskh Arabic","Noto Serif",serif;--ar-sans:"Noto Sans Arabic","Noto Naskh Arabic",system-ui,sans-serif;
 --maxw:1280px;--r:6px;color-scheme:light}
:root[data-theme=dark]{--paper:#111816;--paper2:#16201D;--sage:#18241F;--card:#17211E;--ink:#ECE7DC;--ink2:#C9C6BC;--muted:#A6AEA9;--line:#2C3833;--line2:#24302B;--green:#7CC2A6;--green2:#94D1B8;--brass:#D2AE72;--brass-l:#D2AE72;--clay:#E09A80;--on-green:#0F1714;color-scheme:dark}
@media (prefers-color-scheme:dark){:root:not([data-theme]){--paper:#111816;--paper2:#16201D;--sage:#18241F;--card:#17211E;--ink:#ECE7DC;--ink2:#C9C6BC;--muted:#A6AEA9;--line:#2C3833;--line2:#24302B;--green:#7CC2A6;--green2:#94D1B8;--brass:#D2AE72;--brass-l:#D2AE72;--clay:#E09A80;--on-green:#0F1714;color-scheme:dark}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.65 var(--sans);overflow-x:hidden;text-rendering:optimizeLegibility}
html[dir=rtl] body{font-family:var(--ar-sans);line-height:1.8}
a{color:inherit;text-underline-offset:.18em;text-decoration-thickness:1px}
img{max-width:100%;display:block}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.18;margin:0 0 .5em;letter-spacing:-.012em;color:var(--ink)}
html[dir=rtl] :is(h1,h2,h3,h4){font-family:var(--ar-serif);letter-spacing:0;line-height:1.45}
html:is([lang=ja],[lang=zh],[lang=ko]) :is(h1,h2,h3,h4){letter-spacing:0;line-height:1.35}
h1{font-size:clamp(2.2rem,5.2vw,4.1rem)}h2{font-size:clamp(1.55rem,3vw,2.35rem)}h3{font-size:1.22rem}
p{margin:0 0 1em}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(16px,4vw,40px)}
.skip{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip:focus{width:auto;height:auto;clip-path:none;inset-block-start:10px;inset-inline-start:10px;z-index:99;background:var(--card);padding:8px 14px;border:1px solid var(--line)}
:focus-visible{outline:2px solid var(--brass-l);outline-offset:3px}
.arr{display:inline-block}html[dir=rtl] .arr{transform:scaleX(-1)}
.kicker{font:600 .74rem/1.2 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--brass)}
html:is([dir=rtl],[lang=ja],[lang=zh],[lang=ko]) .kicker{letter-spacing:.02em;font-size:.86rem;text-transform:none}
html[dir=rtl] .kicker{font-family:var(--ar-sans)}
.muted{color:var(--muted)}
/* ---- header */
.top{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-block-end:1px solid var(--line2)}
.top .wrap{display:flex;align-items:center;gap:20px;height:68px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink)}
.brand b{font:600 1.16rem/1 var(--serif);letter-spacing:-.01em;white-space:nowrap}
.brand svg{flex:none}
.nav{display:flex;gap:2px;margin-inline-start:auto;align-items:center}
.nav a{text-decoration:none;padding:8px 13px;font-size:.94rem;color:var(--ink2);border-radius:4px}
.nav a:hover{color:var(--ink);background:var(--paper2)}
.nav a[aria-current]{color:var(--green);box-shadow:inset 0 -2px 0 var(--brass-l);border-radius:0}
.tools{display:flex;gap:6px;align-items:center}
.ibtn{display:inline-grid;place-items:center;min-width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;padding:0;text-decoration:none;position:relative}
.ibtn:hover{background:var(--paper2)}.ibtn svg{width:19px;height:19px}
.ibtn .badge{position:absolute;inset-block-start:-3px;inset-inline-end:-3px;min-width:18px;height:18px;border-radius:9px;background:var(--clay);color:#fff;font:600 .68rem/18px var(--sans);padding:0 5px}
.uisel{appearance:none;-webkit-appearance:none;border:1px solid var(--line);background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='3'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 13px center;color:var(--ink);border-radius:21px;height:42px;padding-inline:15px 32px;font:500 .9rem var(--sans);max-width:160px;cursor:pointer}
html[dir=rtl] .uisel{background-position:left 13px center}
.uisel option{color:#202D2A;background:#fff}
.menu-btn{display:none}
@media (max-width:920px){.nav{position:fixed;inset:68px 0 auto 0;flex-direction:column;align-items:stretch;background:var(--paper);border-block-end:1px solid var(--line);padding:8px 16px 18px;display:none;box-shadow:0 20px 40px rgba(0,0,0,.08)}.nav.open{display:flex}.nav a{padding:14px 6px;font-size:1.05rem;border-block-end:1px solid var(--line2)}.nav a[aria-current]{box-shadow:none}.menu-btn{display:inline-grid}.tools{margin-inline-start:auto}.uisel{max-width:116px}}
@media (max-width:420px){.uisel{max-width:84px;padding-inline:10px 24px;height:38px;font-size:.84rem}.brand b{font-size:1rem}.brand svg{width:26px}.top .wrap{gap:8px}.tools{gap:4px}.tools .ibtn{min-width:38px;width:38px;height:38px}}
/* ---- buttons */
.btn{display:inline-flex;align-items:center;gap:10px;justify-content:center;min-height:50px;padding:0 24px;border-radius:999px;border:1px solid var(--green);background:var(--green);color:var(--on-green);font:500 1rem var(--sans);text-decoration:none;cursor:pointer;transition:background .15s,color .15s}
.btn:hover{background:var(--green2);border-color:var(--green2)}
.btn.line{background:transparent;color:var(--green)}.btn.line:hover{background:var(--sage)}
.btn.sm{min-height:40px;padding:0 16px;font-size:.92rem}
.btn svg{width:18px;height:18px}
.btn[aria-pressed=true]{background:var(--sage);color:var(--green);border-color:var(--sage)}
.link{color:var(--green);font-weight:500;text-decoration:none;display:inline-flex;gap:8px;align-items:center}
.link:hover{text-decoration:underline}
/* ---- hero */
.hero{position:relative;padding-block:clamp(40px,7vw,96px) clamp(36px,6vw,80px);overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='88' viewBox='0 0 88 88'%3E%3Cg fill='none' stroke='%23A4824F' stroke-opacity='.11'%3E%3Cpath d='M44 8l10.5 25.5L80 44 54.5 54.5 44 80 33.5 54.5 8 44l25.5-10.5z'/%3E%3Ccircle cx='44' cy='44' r='9'/%3E%3C/g%3E%3C/svg%3E");mask-image:linear-gradient(90deg,transparent 35%,#000 75%);-webkit-mask-image:linear-gradient(90deg,transparent 35%,#000 75%);pointer-events:none}
html[dir=rtl] .hero:before{mask-image:linear-gradient(270deg,transparent 35%,#000 75%);-webkit-mask-image:linear-gradient(270deg,transparent 35%,#000 75%)}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(30px,5vw,72px);align-items:center;position:relative}
.hero h1{margin:16px 0 22px;max-width:13ch}
html:is([lang=ja],[lang=zh],[lang=ko]) .hero h1{max-width:none}
.hero .lead{font-size:1.16rem;color:var(--ink2);max-width:34rem;margin-bottom:30px}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:34px}
.hsearch{max-width:34rem}
.examples{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:12px;font-size:.9rem;color:var(--muted)}
.examples button{border:0;background:none;padding:0;font:inherit;color:var(--green);text-decoration:underline;text-decoration-color:var(--line);cursor:pointer}
.stack{position:relative;aspect-ratio:1/1.02}
.stack .cover{position:absolute;width:35%}
.stack .cover:nth-child(1){inset-inline-start:0;inset-block-start:14%;transform:rotate(-3deg);z-index:1}
.stack .cover:nth-child(2){inset-inline-start:31%;inset-block-start:2%;width:37%;z-index:3}
.stack .cover:nth-child(3){inset-inline-start:64%;inset-block-start:12%;transform:rotate(3deg);z-index:2}
.stack .cover:nth-child(4){inset-inline-start:17%;inset-block-start:47%;width:29%;transform:rotate(-1.5deg);z-index:4}
@media (max-width:860px){.hero .wrap{grid-template-columns:1fr}.stack{order:-1;max-width:300px;width:100%;margin-inline:auto}.hero h1{max-width:none}}

/* ---- search */
.search{position:relative}
.search>svg{position:absolute;inset-inline-start:18px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--muted);pointer-events:none}
.search input{width:100%;height:58px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:400 1.04rem var(--sans);padding-inline:52px 20px;box-shadow:0 1px 0 rgba(0,0,0,.02)}
.search input:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 18%,transparent)}
.search input::placeholder{color:var(--muted)}
.results{margin-top:10px;display:grid;gap:0;max-height:440px;overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:14px}
.results:empty{display:none}
.res{padding:14px 18px;border-block-end:1px solid var(--line2);display:grid;gap:8px}
.res:last-child{border:0}
.res .h{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.res b{font-weight:600}.nat{color:var(--muted);font-size:.92rem;margin-inline-start:8px}
.res .where{font-size:.82rem;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;border:1px solid var(--line);background:transparent;font-size:.86rem;text-decoration:none;white-space:nowrap;color:var(--ink);cursor:pointer;font-family:inherit}
a.chip:hover,button.chip:hover{border-color:var(--green);color:var(--green)}
.chip.on{background:var(--sage);border-color:transparent;color:var(--green)}
.chip.off{color:var(--muted);border-style:dashed}
.chip[aria-pressed=true]{background:var(--green);color:var(--on-green);border-color:var(--green)}
.dots{display:inline-flex;gap:4px}.dot{width:8px;height:8px;border-radius:50%;background:var(--line)}.dot.on{background:var(--green)}
.hint{color:var(--muted);font-size:.92rem;margin:10px 0 0}
.banner{margin-top:18px;padding:12px 16px;border-inline-start:3px solid var(--brass-l);background:var(--paper2);display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between;max-width:34rem;font-size:.95rem}
.banner[hidden]{display:none}
/* ---- sections */
.sec{padding-block:clamp(48px,7vw,96px)}
.sec.sage{background:var(--sage)}.sec.paper2{background:var(--paper2)}
.sec-h{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:clamp(24px,4vw,44px);flex-wrap:wrap}
.sec-h h2{margin:8px 0 0;max-width:22ch}
.rule{border:0;border-block-start:1px solid var(--line);margin:0}
/* questions: editorial list */
.qs{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(24px,5vw,72px);border-block-start:1px solid var(--line)}
.qs a{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 2px;border-block-end:1px solid var(--line);text-decoration:none;font:400 clamp(1.15rem,2vw,1.45rem)/1.35 var(--serif);color:var(--ink);transition:color .15s,padding .2s}
html[dir=rtl] .qs a{font-family:var(--ar-serif)}
.qs a small{font:500 .8rem var(--sans);color:var(--muted);white-space:nowrap}
.qs a:hover{color:var(--green);padding-inline-start:10px}
@media (max-width:760px){.qs{grid-template-columns:1fr}}
/* start: three intro books */
.intro3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.ib{display:grid;grid-template-columns:120px 1fr;gap:20px;align-items:start}
.ib h3{margin:0 0 12px}.ib h3 a{text-decoration:none}.ib h3 a:hover{color:var(--green)}
.ib dl{margin:0;font-size:.94rem}.ib dt{font:600 .74rem var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--brass);margin-top:10px}
html:is([dir=rtl],[lang=ja],[lang=zh],[lang=ko]) .ib dt{letter-spacing:0;text-transform:none;font-size:.86rem}
.ib dd{margin:2px 0 0;color:var(--ink2)}
@media (max-width:980px){.intro3{grid-template-columns:1fr;max-width:640px}}
/* languages */
.langs{display:flex;flex-wrap:wrap;gap:8px 30px;align-items:baseline}
.langs a{text-decoration:none;font:400 clamp(1.4rem,3vw,2.2rem)/1.4 var(--serif);color:var(--ink);display:inline-flex;align-items:baseline;gap:8px}
.langs a sup{font:500 .74rem var(--sans);color:var(--brass);top:-1em}
.langs a:hover{color:var(--green)}
.lsplit{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(24px,5vw,72px);align-items:start}
@media (max-width:860px){.lsplit{grid-template-columns:1fr}}
/* editor's pick: asymmetric */
.pick{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,5vw,72px)}
.feat{display:grid;grid-template-columns:minmax(150px,240px) 1fr;gap:clamp(20px,3vw,36px);align-items:center}
.feat h3{font-size:clamp(1.6rem,3vw,2.2rem);margin:8px 0 14px}
.side{display:grid;gap:0;border-block-start:1px solid var(--line)}
.side a{display:grid;grid-template-columns:52px 1fr auto;gap:16px;align-items:center;padding:14px 0;border-block-end:1px solid var(--line);text-decoration:none}
.side a:hover h4{color:var(--green)}
.side h4{margin:0;font-size:1.08rem}.side p{margin:2px 0 0;font-size:.86rem;color:var(--muted)}
@media (max-width:900px){.pick{grid-template-columns:1fr}.feat{grid-template-columns:150px 1fr}}
@media (max-width:480px){.feat{grid-template-columns:1fr}.feat .cover{max-width:180px}}
/* paths */
.paths{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-block-start:1px solid var(--line)}
.path{padding:28px clamp(16px,2.4vw,32px) 30px;border-inline-end:1px solid var(--line)}
.path:first-child{padding-inline-start:0}.path:last-child{border:0}
.path .n{font:400 2.6rem/1 var(--serif);color:var(--brass-l)}
.path h3{margin:14px 0 8px}.path>p{color:var(--ink2);font-size:.96rem}
.path ol{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:10px;counter-reset:s}
.path li{counter-increment:s;display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;font-size:.95rem}
.path li:before{content:counter(s);width:26px;height:26px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font:500 .8rem var(--sans);color:var(--muted)}
.path li.done:before{background:var(--green);color:var(--on-green);border-color:var(--green);content:"✓"}
.path li a{text-decoration:none}.path li a:hover{color:var(--green);text-decoration:underline}
.path li small{color:var(--muted);font-size:.78rem}
@media (max-width:900px){.paths{grid-template-columns:1fr}.path{padding-inline:0;border-inline-end:0;border-block-end:1px solid var(--line)}}
/* continue */
.cont{display:flex;gap:16px;flex-wrap:wrap}
.cont a{display:flex;gap:14px;align-items:center;padding:12px 18px 12px 12px;border:1px solid var(--line);border-radius:10px;text-decoration:none;background:var(--card);min-width:260px}
.cont a:hover{border-color:var(--green)}.cont .cover{width:44px}
.cont small{display:block;color:var(--muted);font-size:.82rem}
/* source block */
.source{display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,4vw,56px);align-items:start;max-width:980px}
.source .mark{width:64px;height:64px;color:var(--brass-l)}
.source p{font:400 clamp(1.08rem,1.7vw,1.28rem)/1.6 var(--serif);color:var(--ink2)}
html[dir=rtl] .source p{font-family:var(--ar-serif)}
/* ---- covers (typographic) */
.cover{--c:#163F35;position:relative;aspect-ratio:2/3;background:var(--c);color:#EFE3C6;border-radius:2px 5px 5px 2px;display:flex;flex-direction:column;align-items:center;text-align:center;padding:16% 11% 9%;overflow:hidden;container-type:inline-size;box-shadow:inset 3px 0 0 rgba(0,0,0,.22),inset 4px 0 0 rgba(255,255,255,.06),0 1px 2px rgba(0,0,0,.12),0 18px 34px -14px rgba(20,30,25,.45)}
.cover:before{content:"";position:absolute;inset:5.5%;border:1px solid rgba(214,182,122,.55);pointer-events:none}
.cover:after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(255,255,255,.07),transparent 30%,transparent 70%,rgba(0,0,0,.12));pointer-events:none}
.cover .m{width:24%;color:#D6B67A;flex:none}
.cover .t{margin-block:18% auto;font:500 clamp(10px,15cqi,38px)/1.22 var(--serif);text-wrap:balance;letter-spacing:.005em;color:#F4EBD5}
.cover .t[dir=rtl]{font-family:var(--ar-serif);line-height:1.5}
.cover .t:is([lang=ja],[lang=zh],[lang=ko]){letter-spacing:.06em}
.cover .p{font:600 clamp(6px,4.6cqi,12px)/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#D6B67A;opacity:.9}
.c-iman{--c:#163F35}.c-cennet{--c:#41522B}.c-faideli{--c:#1E3344}.c-namaz{--c:#7A3B2C}.c-ahlak{--c:#5A4423}
.cover.real{padding:0;background:#E9E4DA;box-shadow:0 1px 2px rgba(0,0,0,.1),0 18px 34px -16px rgba(20,30,25,.4)}
.cover.real:before,.cover.real:after{display:none}
.cover.real img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.cover.real>:not(img){visibility:hidden}
.cover.mini{padding:0}.cover.mini>*{display:none}.cover.mini:before{inset:10%}
/* ---- page heads, crumbs */
.phead{padding-block:clamp(28px,5vw,60px) clamp(18px,3vw,30px)}
.crumbs{font-size:.86rem;color:var(--muted);margin-bottom:18px}.crumbs a{text-decoration:none}.crumbs a:hover{text-decoration:underline}
.phead .lead{font-size:1.14rem;color:var(--ink2);max-width:42rem}
/* ---- library */
.lib{display:grid;grid-template-columns:260px 1fr;gap:clamp(24px,4vw,56px);padding-block:10px 60px}
.filters{position:sticky;top:90px;align-self:start;display:grid;gap:26px}
.filters h3{font:600 .74rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--brass);margin:0 0 10px}
html:is([dir=rtl],[lang=ja],[lang=zh],[lang=ko]) .filters h3{letter-spacing:0;text-transform:none;font-size:.88rem}
.filters .opts{display:grid;gap:2px}
.filters label{display:flex;gap:10px;align-items:center;padding:7px 4px;cursor:pointer;font-size:.96rem;border-radius:4px}
.filters label:hover{background:var(--paper2)}
.filters input{accent-color:var(--green);width:17px;height:17px}
.filters label span.c{margin-inline-start:auto;color:var(--muted);font-size:.82rem}
.libbar{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between;margin-bottom:22px;padding-bottom:16px;border-block-end:1px solid var(--line)}
.active{display:flex;flex-wrap:wrap;gap:6px}
.active button{display:inline-flex;gap:6px;align-items:center;border:1px solid var(--green);background:var(--sage);color:var(--green);border-radius:999px;padding:4px 10px 4px 12px;font:500 .84rem var(--sans);cursor:pointer}
.fbtn{display:none}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:34px 24px}
.ed{display:flex;flex-direction:column;gap:10px;text-decoration:none}
.ed .cover{width:100%;transition:transform .2s}.ed:hover .cover{transform:translateY(-4px)}
.ed b{font:500 1.05rem/1.3 var(--serif)}.ed span{color:var(--muted);font-size:.86rem;line-height:1.4}
html[dir=rtl] .ed b{font-family:var(--ar-serif)}
.ed.req{justify-content:center;align-items:flex-start;border:1px dashed var(--line);border-radius:6px;padding:22px;aspect-ratio:auto}
.empty{padding:50px 0;text-align:center;color:var(--muted)}
.hide{display:none!important}
@media (max-width:860px){.lib{grid-template-columns:1fr}.filters{position:fixed;inset:0;z-index:60;background:var(--paper);padding:24px 20px 90px;overflow:auto;display:none;align-content:start}.filters.open{display:grid}.fbtn{display:inline-flex}.filters .close{display:flex!important}.grid{grid-template-columns:repeat(2,1fr);gap:26px 16px}}
.filters .close{display:none;justify-content:space-between;align-items:center}
/* ---- book & edition pages */
.bk{display:grid;grid-template-columns:minmax(200px,330px) 1fr;gap:clamp(28px,6vw,90px);padding-block:clamp(24px,4vw,48px) 30px;align-items:start}
.bk .cover{width:100%}
.bk h1{font-size:clamp(2rem,4.2vw,3.3rem);margin:12px 0 10px}
.bk .orig{color:var(--muted);font-size:.98rem;margin:0 0 22px}
.bk .lead{font-size:1.14rem;color:var(--ink2);max-width:40rem}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:18px 28px;margin:28px 0;padding-block:20px;border-block:1px solid var(--line);max-width:44rem}
.facts dt{font:600 .72rem var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--brass);margin-bottom:4px}
html:is([dir=rtl],[lang=ja],[lang=zh],[lang=ko]) .facts dt{letter-spacing:0;text-transform:none;font-size:.84rem}
.facts dd{margin:0;font-size:.98rem}
.who{display:grid;grid-template-columns:1fr 1fr;gap:20px 40px;max-width:44rem;margin:6px 0 26px}
.who h3{font:600 .74rem var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--brass);margin:0 0 6px}
html:is([dir=rtl],[lang=ja],[lang=zh],[lang=ko]) .who h3{letter-spacing:0;text-transform:none;font-size:.88rem}
.who p{margin:0;color:var(--ink2)}
@media (max-width:640px){.who{grid-template-columns:1fr}}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0 8px}
.share{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;margin-top:20px;font-size:.9rem;color:var(--muted)}
.share a,.share button{display:inline-flex;gap:6px;align-items:center;background:none;border:0;padding:4px 0;color:var(--ink2);font:inherit;cursor:pointer;text-decoration:none;white-space:nowrap}
.share a:hover,.share button:hover{color:var(--green);text-decoration:underline}
.share svg{width:16px;height:16px}
.qr{display:flex;gap:16px;align-items:center;margin-top:24px;font-size:.88rem;color:var(--muted)}
.qr #qr img,.qr #qr canvas{width:92px;height:92px;background:#fff;padding:6px;border:1px solid var(--line)}
.usenote{margin:26px 0 0;font-size:.86rem;color:var(--muted);max-width:40rem;padding-inline-start:14px;border-inline-start:2px solid var(--line)}
.usenote a{color:var(--green)}
@media (max-width:760px){.bk{grid-template-columns:1fr}.bk .cover{max-width:230px}}
/* ---- languages page */
.tabs{display:flex;gap:4px;flex-wrap:wrap;border-block-end:1px solid var(--line);margin-bottom:22px}
.tab{border:0;border-block-end:2px solid transparent;background:none;color:var(--ink2);padding:10px 14px;font:500 .94rem var(--sans);cursor:pointer;margin-bottom:-1px}
.tab[aria-pressed=true]{color:var(--green);border-color:var(--green)}
.toggle{display:inline-flex;gap:8px;align-items:center;font-size:.94rem;cursor:pointer}.toggle input{accent-color:var(--green);width:17px;height:17px}
.lctrl{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-bottom:24px}.lctrl .search{flex:1;min-width:240px;max-width:560px}
.lgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:0 28px;border-block-start:1px solid var(--line)}
.lc{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:14px 2px;border:0;border-block-end:1px solid var(--line2);background:none;text-align:start;color:var(--ink);font:inherit;cursor:pointer}
.lc:hover b{color:var(--green)}.lc b{font-weight:500}.lc .nat{grid-column:1;margin:0;font-size:.88rem}
.lc .dots{grid-row:1/3;grid-column:2;align-self:center}
.lc.has b{font-weight:600}
.count{font-size:.9rem;color:var(--muted);margin:0 0 10px}
dialog.panel{border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);padding:0;max-width:580px;width:calc(100% - 24px);box-shadow:0 40px 90px rgba(0,0,0,.3)}
dialog.panel::backdrop{background:rgba(16,24,21,.45)}
.panel .ph{display:flex;justify-content:space-between;align-items:start;gap:10px;padding:22px 24px 8px}
.panel .ph h3{margin:0;font-size:1.5rem}
.panel .pb{padding:8px 24px 24px;display:grid;gap:0}
.prow{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px 0;border-block-end:1px solid var(--line2)}
.prow>div{display:flex;gap:12px;align-items:center}.prow .cover{width:30px}
.prow small{display:block;color:var(--muted);font-size:.82rem}
.mapbox{margin-top:10px}.mapbox svg{width:100%;height:auto;display:block}
.mapbox path{fill:color-mix(in srgb,var(--ink) 12%,var(--paper));stroke:var(--paper);stroke-width:.5;cursor:pointer;transition:fill .15s}
.mapbox path.has{fill:color-mix(in srgb,var(--green) 55%,var(--paper))}
.mapbox path:hover,.mapbox path.sel{fill:var(--brass-l)}
.maplegend{display:flex;gap:18px;font-size:.84rem;color:var(--muted);padding-top:8px}
.maplegend i{display:inline-block;width:11px;height:11px;border-radius:2px;vertical-align:-1px;margin-inline-end:6px}
/* ---- prose / misc */
.prose{max-width:44rem;font-size:1.08rem}.prose p{margin:0 0 1.1em}.prose ul{padding-inline-start:1.2em}
.helpline{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center;justify-content:space-between;padding:26px 0;border-block:1px solid var(--line)}
.helpline p{margin:0;font:400 1.15rem/1.5 var(--serif)}
html[dir=rtl] .helpline p{font-family:var(--ar-serif)}
.savedlist{display:grid;gap:0;border-block-start:1px solid var(--line);max-width:860px}
.sv{display:grid;grid-template-columns:56px 1fr auto;gap:18px;align-items:center;padding:16px 0;border-block-end:1px solid var(--line)}
.sv h3{margin:0;font-size:1.12rem}.sv h3 a{text-decoration:none}.sv p{margin:2px 0 0;font-size:.88rem;color:var(--muted)}
.sv .acts{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.note{font-size:.92rem;color:var(--muted);padding:12px 16px;background:var(--paper2);border-inline-start:3px solid var(--line);max-width:860px;margin-bottom:24px}
/* ---- footer */
footer{background:#13231E;color:#C9CFC9;padding-block:56px 40px;font-size:.92rem;margin-top:0}
footer .wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:30px 40px}
footer .brand{color:#F1ECDF}footer p{margin:14px 0 0;max-width:28rem;color:#AEB6B0}
footer h4{font:600 .72rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#C8A86E;margin:0 0 12px}
html:is([dir=rtl],[lang=ja],[lang=zh],[lang=ko]) footer h4{letter-spacing:0;text-transform:none;font-size:.86rem}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
footer a{color:#E7E1D2;text-decoration:none}footer a:hover{text-decoration:underline}
footer .lic{grid-column:1/-1;border-block-start:1px solid #2A3B35;padding-top:20px;color:#8E9993;font-size:.84rem}
@media (max-width:760px){footer .wrap{grid-template-columns:1fr 1fr}footer .wrap>div:first-child{grid-column:1/-1}}
/* ---- reader */
.rd-body{background:#E9E4DA}.rd-body.dark{background:#1A1F1D}.rd-body.sepia{background:#E8DCC2}
.rd-bar{position:sticky;top:0;z-index:30;display:flex;gap:6px;align-items:center;padding:8px 12px;background:var(--paper);border-block-end:1px solid var(--line);flex-wrap:wrap;font-size:.9rem}
.rd-body.dark .rd-bar{background:#111614;color:#E5E0D4;border-color:#2B3430}
.rd-body.dark .rd-bar .ibtn{color:#E5E0D4;border-color:#38423D}
.rd-bar .ibtn{width:40px;min-width:40px;height:40px;border-radius:8px}
.rd-bar .ttl{font:500 1rem var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:34vw;margin-inline:6px}
.rd-bar input{width:58px;height:38px;border-radius:8px;border:1px solid var(--line);background:transparent;color:inherit;text-align:center;font:inherit}
.rd-bar .sp{flex:1}.rd-bar .q{width:160px;text-align:start;padding-inline:10px}
.rd-bar .seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.rd-bar .seg button{border:0;background:transparent;color:inherit;padding:0 10px;height:38px;font:500 .82rem var(--sans);cursor:pointer}
.rd-bar .seg button[aria-pressed=true]{background:var(--green);color:var(--on-green)}
.rd-prog{position:absolute;inset-inline:0;bottom:-1px;height:2px;background:transparent}.rd-prog i{display:block;height:100%;width:0;background:var(--brass-l)}
#pages{display:flex;flex-direction:column;align-items:center;gap:16px;padding:20px 8px 80px}
.pg{background:#fff;box-shadow:0 2px 14px rgba(0,0,0,.18)}
.pg canvas{display:block;width:100%;height:100%}
.dark .pg canvas{filter:invert(.9) hue-rotate(180deg) brightness(.95)}
.sepia .pg canvas{filter:sepia(.7) brightness(.95) contrast(.96)}
.rd-msg{max-width:560px;margin:60px auto;text-align:center;padding:0 20px}
.rd-msg .btn{margin:6px}
.toc{position:fixed;inset-block:58px 0;inset-inline-start:0;width:min(360px,88vw);background:var(--card);border-inline-end:1px solid var(--line);z-index:35;overflow:auto;padding:16px 18px;box-shadow:20px 0 50px rgba(0,0,0,.15);display:none}
.toc.open{display:block}.toc a{display:block;padding:8px 6px;text-decoration:none;border-block-end:1px solid var(--line2);font-size:.94rem}.toc a:hover{color:var(--green)}
.toc .l2{padding-inline-start:20px;font-size:.88rem;color:var(--ink2)}
@media (max-width:700px){.rd-bar .ttl{display:none}.rd-bar .q{width:110px}.rd-bar .zz{display:none}}
@media print{.top,footer,.share,.qr{display:none}}
@media (max-width:380px){#themeBtn{display:none}}
/* ---- hero scene (original vector illustration) */
.hero.has-scene{min-height:clamp(620px,92vh,940px);display:flex;align-items:flex-start;padding-bottom:clamp(90px,10vw,140px)}
.hero.has-scene:before{display:none}
.hero.has-scene>.wrap{z-index:1;width:100%}
.scene{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block}
.hero[data-v=a]{--sk1:#BCC5BB;--sk2:#EAE4D5;--orb:#F7F3E6;--orb2:#E9E3D1;--glow:#FFFDF2;--d1:#E6DAC1;--d2:#DCC7A0;--d3:#D2B98D;--d4:#E8D8B6;--shd:#9C7F52;--sil:#3A3026}
.hero[data-v=b]{--sk1:#EFA766;--sk2:#FBE2BC;--orb:#FFF5DB;--orb2:#FFF5DB;--glow:#FFE4A9;--d1:#F4C988;--d2:#EDB466;--d3:#E5A050;--d4:#F3C98E;--shd:#A55A23;--sil:#4A2828}
.hero .stars{display:none}
:root[data-theme=dark] .hero.has-scene{--sk1:#0B151C;--sk2:#2A3735;--orb:#EEE9D8;--orb2:#DAD3BE;--glow:#EEE9D8;--d1:#3B3C33;--d2:#4A4637;--d3:#585039;--d4:#3D392C;--shd:#000;--sil:#0B0E0D}
:root[data-theme=dark] .hero.has-scene .stars{display:inline}
:root[data-theme=dark] .hero.has-scene #gl stop{stop-opacity:.22}
@media (prefers-color-scheme:dark){:root:not([data-theme]) .hero.has-scene{--sk1:#0B151C;--sk2:#2A3735;--orb:#EEE9D8;--orb2:#DAD3BE;--glow:#EEE9D8;--d1:#3B3C33;--d2:#4A4637;--d3:#585039;--d4:#3D392C;--shd:#000;--sil:#0B0E0D}:root:not([data-theme]) .hero.has-scene .stars{display:inline}}
.hero.has-scene .search input{background:color-mix(in srgb,var(--card) 92%,transparent)}
.hero.has-scene .banner{background:color-mix(in srgb,var(--paper) 85%,transparent)}
html[dir=rtl] .scene{transform:scaleX(-1)}
@media (max-width:860px){.hero.has-scene{min-height:0;padding-bottom:340px}}