:root{color-scheme:light;--green:#183b30;--gold:#b28b4b;--paper:#f4efe4}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:#24392e;font-family:system-ui,sans-serif;line-height:1.8}a{color:inherit}button,input{font:inherit}button{cursor:pointer}header{display:flex;justify-content:space-between;align-items:center;padding:18px 5vw;background:#132c25;color:#efe8d6}header a{text-decoration:none}header .logo{font-size:22px;font-weight:800}.hero{padding:80px max(6vw,24px);color:#fff5dd;background:linear-gradient(90deg,#0a201cf5,#0a201cb0),url('assets/three-realms/shu.webp') center/cover}.hero small{letter-spacing:.15em;color:#e4c795}h1,h2,h3{font-family:Georgia,'Noto Serif KR',serif}h1{font-size:clamp(34px,4.5vw,62px);line-height:1.4;font-weight:500;letter-spacing:-.035em;margin:18px 0 25px}h1 em{font-style:normal;color:#e6c481}.hero p{max-width:680px;font-size:16px}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}.gold,.outline{display:inline-block;padding:12px 22px;border-radius:5px;text-decoration:none;background:#c19b5d;color:#172d23;border:1px solid #c19b5d}.outline{background:transparent;color:inherit}.wrap{max-width:1380px;margin:auto;padding:50px 30px}.section-intro{max-width:850px;margin-bottom:30px}.section-intro h2{font-size:32px;margin:10px 0}.section-intro>small{letter-spacing:.12em;color:#96713c}.author-note{padding:18px 22px;border:1px solid #b89352;background:#e7e8da}.book-layout{display:grid;grid-template-columns:255px minmax(0,1fr);gap:24px;align-items:start}.book-nav{background:#e5e6d8;padding:15px;border-radius:6px}.book-nav input{width:100%;border:1px solid #c5c4b1;background:#fffdf4;padding:10px;border-radius:5px}#book-index{max-height:680px;overflow:auto;margin-top:12px}#book-index button{display:block;width:100%;text-align:left;border:0;background:transparent;padding:10px 8px;border-radius:4px;font-size:13px;color:#4b5d4c}#book-index button[aria-current=true]{background:#234a38;color:#fff9e8}.book-spread{display:grid;grid-template-columns:1fr 1fr;background:#fffaf0;border-radius:5px 12px 12px 5px;box-shadow:0 12px 35px #5142282b,3px 3px #d7cfbb,6px 6px #eee6d4;min-height:620px;transform-origin:left center;outline-offset:6px}.book-page{padding:35px clamp(20px,3vw,42px);overflow-wrap:anywhere}.book-page:first-child{border-right:1px solid #ded3b9;background:linear-gradient(90deg,#fffaf0 96%,#e5ddc9)}.book-page:last-child{background:linear-gradient(90deg,#e8e1cf,#fffaf0 5%)}.book-page small{font-size:11px;color:#8c7958}.book-page h2{font-size:29px;line-height:1.6;margin:28px 0}.book-page h3{font-size:23px;margin:24px 0}.prose{font-family:serif;font-size:19px;line-height:2.2;word-break:keep-all}.book-page p{word-break:keep-all}.book-cast{display:grid;gap:12px;margin:25px 0}.cast-link{display:flex;align-items:center;gap:15px;text-decoration:none;border:1px solid #dbd1b7;padding:10px;border-radius:8px;background:#f8f0df}.cast-link:hover{background:#eee3ca}.cast-link img{width:54px;height:65px;object-fit:cover;border-radius:5px}.cast-link span{display:flex;flex-direction:column}.cast-link strong{font-size:16px}.cast-link small{font-size:11px}.book-page details{font-size:12px;color:#7d765e}.past-meeting{font-size:12px}.paging{display:flex;justify-content:space-between;align-items:center;margin:25px 0}.paging button{border:1px solid #b6ad93;background:#fff9e9;padding:10px 20px;border-radius:5px;color:#3b513d}.paging button:disabled{opacity:.4}#book-index-toggle{display:none}.meetings{display:grid;grid-template-columns:1fr 1fr;gap:24px}.meeting-card{display:flex;background:#fffaf0;border:1px solid #d9d6c5;border-radius:10px;overflow:hidden}.meeting-card>img{width:32%;object-fit:cover}.meeting-card>div{padding:25px;min-width:0}.meeting-card h3{font-size:21px;margin:12px 0}.meeting-card p{font-family:serif;font-size:15px}.meeting-card small{display:block;font-size:11px;color:#8b795d}.meeting-card audio{width:100%;height:36px;margin-top:10px}.meeting-card .gold{font-size:12px;margin-bottom:15px}.lands{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.lands a{padding:70px 20px 20px;background-size:cover;background-position:center;color:white;border-radius:10px;text-decoration:none;font-size:24px;font-family:serif;text-shadow:0 2px 8px #000}.lands small{font-size:12px;display:block}footer{padding:25px 30px;background:#19382c;color:#d8dbc9;font-size:12px;text-align:center}a:focus-visible,button:focus-visible{outline:3px solid #bb7d31;outline-offset:3px}@media(max-width:1000px){.book-layout{grid-template-columns:200px minmax(0,1fr)}.book-spread{grid-template-columns:1fr}.book-page:first-child{border-right:0;border-bottom:1px solid #ded3b9}.book-page{padding:26px}.meetings{grid-template-columns:1fr}}@media(max-width:650px){.wrap{padding:32px 16px}.hero{padding:45px 22px}header{padding:14px 20px}.book-layout{grid-template-columns:1fr}.book-nav{display:none}.book-nav.open{display:block}#book-index-toggle{display:inline-block;margin-bottom:16px;border:1px solid #b9b497;background:#e8e6d5;padding:9px 15px;border-radius:5px}#book-index{max-height:280px}.book-page h2{font-size:25px}.prose{font-size:18px}.meeting-card{display:block}.meeting-card>img{width:100%;height:190px;object-position:center 35%}.meeting-card>div{padding:20px}.lands{gap:10px}.lands a{font-size:20px;padding:50px 13px 12px}.lands small{font-size:10px}.section-intro h2{font-size:26px}}

/* A shared book height keeps the searchable contents and pages aligned. */
@media(min-width:1001px){.book-layout{--book-height:720px;align-items:start}.book-nav{height:var(--book-height);display:flex;flex-direction:column;overflow:hidden}#book-index{max-height:none;min-height:0;flex:1}.book-spread{height:var(--book-height);min-height:0}.book-page{min-height:0;overflow-y:auto;padding:26px}.book-cast{gap:7px;margin:14px 0}.cast-link{padding:7px;gap:10px}.cast-link img{width:42px;height:49px}.book-cast[data-many=true] .cast-link img{width:36px;height:40px}.book-cast[data-many=true] .cast-link{padding:5px}.book-cast[data-many=true] strong{font-size:14px}}
.book-spread{position:relative;perspective:1800px;isolation:isolate}.page-turn-leaf{position:absolute;inset:0 0 0 50%;z-index:3;transform-origin:left center;background:linear-gradient(90deg,#e6dcc5,#fffaf0 8%);box-shadow:-8px 0 22px #59421c33;backface-visibility:hidden;pointer-events:none;overflow:hidden}.page-turn-leaf.backward{inset:0 50% 0 0;transform-origin:right center}.paging{position:relative;justify-content:center;gap:70px;margin:18px 0 0;padding-bottom:30px}.paging button{font-size:23px;padding:0 19px;background:transparent;border:0}.paging #page-count{position:absolute;bottom:0;font-size:13px}.book-spread .book-page{scrollbar-width:thin}

.hero{min-height:650px;padding:100px max(6vw,24px);background:linear-gradient(90deg,#100e19c9,transparent 80%),url('assets/kingdom-book-v5/epic-cover-lowered-v6.png') center/cover}.hero h1{font-size:clamp(32px,4vw,62px)}.hero p{max-width:600px}.wrap{max-width:1640px}.book-layout{display:flex;flex-direction:column;gap:18px}.book-layout>div{width:100%}.book-toolbar{display:flex;gap:14px;align-items:center;justify-content:space-between;width:100%;padding:12px 16px;background:#e6ddcb;border:1px solid #c9bda2;border-radius:7px}.book-toolbar label{display:flex;align-items:center;gap:10px;flex:1}.book-toolbar #book-index{flex:1;width:100%;margin:0;max-height:none;padding:10px;background:#fffbf1;border:1px solid #b4a88d;border-radius:4px;font:14px sans-serif;color:#3d3325}.book-toolbar input{padding:10px;max-width:230px;border:1px solid #b4a88d;border-radius:4px}.book-toolbar button{padding:10px;border:1px solid #b4a88d;border-radius:4px;background:#fffaf0;color:#4a3b26;white-space:nowrap}.book-spread{height:850px;min-height:720px;grid-template-columns:1.1fr 1fr}.book-page{padding:30px 40px;overflow-y:auto}.book-scene-art{display:block;width:calc(100% + 80px);height:290px;object-fit:cover;margin:-30px -40px 26px}.book-page h2{font-size:31px;margin:15px 0}.prose{font-size:18px;line-height:2}.book-cast{gap:9px}.cast-link img{width:52px;height:60px}.book-page details{margin:20px 0}.paging{margin-top:20px}#book-index-toggle{display:none!important}#book:fullscreen,#book.expanded-book{background:#eee6d6;overflow:auto;padding:24px;max-width:none}#book:fullscreen .section-intro{display:none}#book:fullscreen .book-spread{height:calc(100dvh - 150px);min-height:650px}
@media(max-width:1000px){.book-spread{height:auto;grid-template-columns:1fr;min-height:0}.book-page{overflow:visible}.book-scene-art{height:320px}.book-toolbar{flex-wrap:wrap}.book-toolbar label{flex-basis:100%}.book-toolbar input{max-width:none;flex:1;min-width:0}}
@media(max-width:650px){.hero{min-height:600px;padding:60px 22px;background-position:62% center}.hero h1,.hero p{background:#0e10234d}.book-page{padding:24px}.book-scene-art{width:calc(100% + 48px);margin:-24px -24px 22px;height:240px}.book-page h2{font-size:25px}.prose{font-size:17px}.book-toolbar{padding:10px}.book-toolbar label{font-size:12px}.book-toolbar #book-index{min-width:0;width:100px}.book-toolbar button{font-size:12px}.book-toolbar input{width:130px}.book-spread{min-height:0}.paging{padding-bottom:24px}}

/* Keep all three faces within the wide-screen hero. */
@media(min-width:1000px){.hero{background-position:center 38%;min-height:max(650px,30vw)}}

/* Compact contents and a two-sided, slowly turning paper leaf. */
.book-toolbar{justify-content:flex-start;padding:9px 0;background:transparent;border:0;gap:16px}.book-toolbar label{flex:0 1 340px;min-width:0}.book-toolbar #book-index{width:290px;min-width:0;flex:1}.book-toolbar button{margin-left:auto}.book-spread{grid-template-columns:1fr 1fr;perspective:2400px;box-shadow:0 22px 40px #49372030,0 2px 0 #d0c4a8,0 5px 0 #fcf6e8,0 7px 0 #cbbd9e}.book-spread:after{content:'';position:absolute;z-index:2;top:0;bottom:0;left:calc(50% - 24px);width:48px;pointer-events:none;background:linear-gradient(90deg,transparent,#765e3220 32%,#4b381b45 48%,#fff9ed66 51%,#78613c22 68%,transparent)}.page-turn-leaf{overflow:visible;backface-visibility:visible;transform-style:preserve-3d;background:none;box-shadow:none}.turn-face{position:absolute;inset:0;backface-visibility:hidden;overflow:hidden;background:#fffaf0;box-shadow:8px 8px 28px #37240e35}.turn-face>.book-page,.page-turn-under>.book-page{height:100%;margin:0}.turn-face:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#513a1b30,transparent 12%,#fff9e833 65%,#63492320)}.turn-back{transform:rotateY(180deg)}.page-turn-under{position:absolute;inset:0 50% 0 0;z-index:2;background:#fffaf0;overflow:hidden;pointer-events:none}.page-turn-under.backward{inset:0 0 0 50%}.paging{gap:90px;padding:12px 0 34px}.paging button{min-width:100px;min-height:46px;padding:5px 18px;font-size:18px;border:1px solid #c1ac83;border-radius:24px;background:#fff9ec;box-shadow:0 2px 6px #6c512418}.paging button:hover:not(:disabled){background:#e7d6b8}.paging button:disabled{opacity:.35}
@media(max-width:1000px){.book-spread{grid-template-columns:1fr}.book-spread:after{display:none}}@media(max-width:650px){.book-toolbar{gap:8px}.book-toolbar label{flex:1}.book-toolbar #book-index{width:160px}.book-toolbar button{font-size:11px;padding:9px 6px}.paging{gap:40px}}

/* The controls and both folios belong to the book, including in fullscreen. */
.book-spread>.paging{position:absolute;inset:0;z-index:5;margin:0;padding:0;display:block;pointer-events:none}.book-spread>.paging button{position:absolute;top:50%;transform:translateY(-50%);pointer-events:auto;min-width:0;width:46px;height:62px;padding:0;border-radius:10px;font-size:28px;color:#634722;background:#fffaeeeF;border:1px solid #b59a68;box-shadow:0 4px 15px #35230e30}.book-spread>.paging #prev-page{left:-22px}.book-spread>.paging #next-page{right:-22px}.book-spread>.paging #page-count{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.book-folio{position:absolute;bottom:12px;z-index:4;background:#fffaf0eF;color:#786342;font:13px/1.5 Georgia,serif;padding:4px 12px;border-radius:4px;pointer-events:none}.folio-left{left:24px}.folio-right{right:24px}.book-page{padding-bottom:60px}#book:fullscreen{padding:16px 32px;overflow:hidden}#book:fullscreen .book-layout{height:100%;gap:12px}#book:fullscreen .book-layout>div{flex:1;min-height:0}#book:fullscreen .book-spread{height:100%;min-height:0}#book:fullscreen .book-toolbar{flex-shrink:0}#book:fullscreen #book-index-toggle{display:none!important}
@media(max-width:1000px){.folio-left{top:12px;bottom:auto}.book-spread>.paging #prev-page{left:-12px}.book-spread>.paging #next-page{right:-12px}.book-spread>.paging button{width:34px;height:52px;font-size:23px}#book:fullscreen .book-spread{grid-template-rows:1fr 1fr}.book-folio{font-size:11px}.book-page{min-height:0}.book-spread{margin-bottom:24px}#book:fullscreen .book-spread{margin-bottom:0}}
@media(max-width:650px){#book:fullscreen{padding:12px 18px}.folio-left{left:18px}.folio-right{right:18px}.book-spread>.paging button{width:30px;height:48px}.book-toolbar button{font-size:10px}.book-toolbar #book-index{width:120px}}
#book:fullscreen .book-page{overflow:auto;overscroll-behavior:contain} @media(max-width:650px){#book:fullscreen .book-scene-art{height:115px;margin-bottom:16px}#book:fullscreen .book-page{padding:20px 24px 40px}#book:fullscreen .book-page h2{font-size:22px;margin:12px 0}#book:fullscreen .prose{font-size:15px;line-height:1.8}#book:fullscreen .book-page h3{font-size:19px;margin:10px 0}#book:fullscreen .book-page p{font-size:14px}#book:fullscreen .book-cast{margin:14px 0}}