/* Eight Stories: ink, vermilion seals, warm paper, and framed comic panels. */
:root{--story-ink:#112924;--story-red:#a7332c;--story-gold:#d9b878;--story-paper:#f7efde;--story-text:#263a32}
html{background:#081b19}body{box-shadow:0 0 0 1px #d6ba8033,0 0 50px #0007}
.site-header,.intl-header,body:not(.intl) #app>header:not(:has(.catalog-nav)){position:relative;background:#102a26!important;color:#f7edda!important;padding:17px 18px 0!important;border-bottom:3px solid #a7342f!important;display:flex!important;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;min-height:0!important;height:auto!important}
.site-header:before,.intl-header:before,body:not(.intl) #app>header:not(:has(.catalog-nav)):before{content:'';height:3px;position:absolute;inset:0 0 auto;background:repeating-linear-gradient(90deg,#d6b678 0 14px,transparent 14px 19px,#d6b678 19px 21px,transparent 21px 27px);opacity:.8}
.site-header .wordmark,.intl-header .intl-brand,body:not(.intl) #app>header:not(:has(.catalog-nav)) .brand{font-family:'Noto Serif TC','Songti TC','PMingLiU',serif!important;color:#fff4db!important;font-size:1.05rem!important;font-weight:800;letter-spacing:.04em;text-decoration:none;max-width:55%;line-height:1.3}
.intl-header .intl-brand:before{content:'八';display:inline-grid;place-items:center;width:30px;height:34px;margin-right:9px;border:2px solid #e3c47f;outline:2px solid #a3312b;background:#a3312b;color:#fff4df;font:700 20px serif;vertical-align:middle}
.site-header .wordmark .seal,body:not(.intl) #app>header:not(:has(.catalog-nav)) .seal{background:#a3312b;color:#fff1d5;border-color:#d9b878}
#app header nav.site-tools{width:auto!important;max-width:100%!important;margin:0 0 0 auto!important;padding:0!important;gap:5px!important;white-space:normal!important;overflow:visible!important;display:flex!important;flex-wrap:wrap!important;justify-content:flex-end!important}
#app header nav.site-tools button,#app header nav.site-tools select{font-size:.75rem!important;padding:5px 8px!important;min-height:34px!important;border:1px solid #d3be9970!important;color:#f8eed9!important;background:#203e37!important;border-radius:4px!important}
#app header nav.site-tools .intl-lang{margin:0!important}#app header nav.site-tools .intl-lang select{width:auto!important;min-width:0!important;max-width:118px!important}
#app header nav.site-tools .language-switch{display:flex;gap:2px}#app header nav.site-tools .language-switch button{min-height:32px!important;padding:4px 6px!important}
#app header nav.site-categories{width:calc(100% + 36px)!important;max-width:none!important;flex:0 0 calc(100% + 36px);margin:1px -18px 0!important;padding:0 14px!important;display:flex!important;gap:3px!important;flex-wrap:nowrap!important;justify-content:flex-start!important;overflow-x:auto!important;white-space:nowrap!important;scrollbar-width:none;position:relative}
#app header nav.site-categories::-webkit-scrollbar{display:none}#app header nav.site-categories a{color:#e8dec8!important;display:block;flex:none;font:600 14px/1.2 system-ui,sans-serif!important;text-decoration:none;padding:15px 10px 13px!important;border-bottom:3px solid transparent;min-height:44px}
#app header nav.site-categories a[aria-current=page]{color:#fff3d4!important;border-color:#e6c283;font-weight:800}#app header nav.site-categories a:focus-visible{outline:2px solid #f2d491;outline-offset:-3px}
/* Illustrated covers: bold ink frame, seal and paper, with the image as the star. */
.intl #main{background:#f6efdf}.intl .intl-hero{padding:0 0 30px!important;gap:0!important;background:linear-gradient(#14352e 0 18%,#f6efdf 18%);display:flex!important;flex-direction:column}.intl .intl-hero>div:nth-child(2){order:-1;width:100%;padding:20px 18px 0}.intl .intl-hero>div:first-child{order:0;width:100%;padding:24px 24px 8px;position:relative}.intl .intl-hero>div:first-child:after{content:'八';position:absolute;right:24px;top:25px;color:#a62f2c;border:2px solid #a62f2c;padding:3px 7px;font:bold 21px serif;transform:rotate(-7deg);opacity:.9}.intl .intl-hero h1{font-family:'Noto Serif TC','Songti TC','PMingLiU',serif;font-weight:850;font-size:2.15rem!important;color:#172f29;max-width:85%;margin:5px 0 9px}.intl .intl-hero h2{font-weight:700;color:#a53b2e;font-size:1.25rem;margin:12px 0}.intl .intl-hero .intl-eyebrow{color:#866b46;font-weight:700}.intl .intl-hero .intl-lead{font-size:1rem;line-height:1.85}.intl .intl-hero .intl-art{aspect-ratio:4/3!important;max-height:none!important;border-radius:4px!important;border:3px solid #e0c086;box-shadow:6px 6px 0 #ad382d;background:#142b26}.intl .intl-hero .intl-art img,.intl .intl-hero .intl-art video{object-fit:cover}.intl .intl-hero .intl-actions button:first-child{background:#a7332c!important;border-color:#a7332c!important;color:white!important;font-weight:800;box-shadow:3px 3px 0 #dfc390}.intl .intl-stage{background:#f6efdf}.intl .intl-stage .intl-art,.intl .intl-reader article>.intl-art{border:2px solid #c5a06a;border-radius:5px;box-shadow:5px 5px 0 #ab392d}.intl .intl-reader article{min-width:0}.intl .intl-reader article>h1{font-weight:850;color:#263a32}.intl .intl-reader article>blockquote{border-left:5px solid #a7332c;background:#eee1c8}.intl .intl-action{border-left:4px solid #a7332c;border-radius:2px}.intl .intl-action strong{color:#a7332c}
/* Home story posters reuse each product's own original art. */
body:has(.catalog-nav){background:#f2ead9;color:#203630}body:has(.catalog-nav) header{background:#112924;color:#f8eedb;border-bottom:3px solid #a7332c}body:has(.catalog-nav) .hero{display:flex;flex-direction:column-reverse;align-items:stretch;gap:0;padding:20px 0 36px}.catalog-nav{scrollbar-width:none}.catalog-nav::-webkit-scrollbar{display:none}.catalog-nav a{border-radius:0!important;border-bottom:3px solid transparent}.catalog-nav a[aria-current=page]{background:transparent!important;border-color:#e4c17e;color:#fff3d4!important}.catalog-nav a:hover{background:#24463c!important;color:#fff!important}body:has(.catalog-nav) .hero-image{border-radius:4px!important}body:has(.catalog-nav) main .hero-image{height:280px;border:3px solid #e1bf80;box-shadow:6px 6px 0 #a7332c}body:has(.catalog-nav) main .hero-image img{object-position:center}body:has(.catalog-nav) main .hero>div:first-child{position:relative;padding:28px 5px 0}body:has(.catalog-nav) main .hero>div:first-child:after{content:'八';position:absolute;right:6px;top:28px;color:#a7332c;border:2px solid #a7332c;font:bold 21px serif;padding:2px 7px;transform:rotate(-7deg)}body:has(.catalog-nav) .hero h1{font-size:2.3rem;color:#18352c;max-width:85%}body:has(.catalog-nav) .eyebrow{color:#9e472f}body:has(.catalog-nav) .lead{color:#526359;font-size:1rem}body:has(.catalog-nav) .primary{background:#a7332c;color:#fff7ea;border-radius:3px;box-shadow:3px 3px 0 #dfc390}body:has(.catalog-nav) .section-head{border-top:2px solid #a7332c}body:has(.catalog-nav) .section-head h2{color:#16352c}body:has(.catalog-nav) .section-head p{color:#68796b}body:has(.catalog-nav) .grid{gap:16px}body:has(.catalog-nav) .card{position:relative;min-height:300px;border-radius:4px!important;border:2px solid #20372e;background:#142c26;color:#fff6e5!important;box-shadow:4px 4px 0 #c0a579}body:has(.catalog-nav) .card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}body:has(.catalog-nav) .card-body{position:relative;z-index:1;justify-content:end;min-height:300px;background:linear-gradient(0deg,rgba(8,25,21,.97) 0%,rgba(8,25,21,.84) 37%,rgba(8,25,21,.04) 82%);padding:22px}body:has(.catalog-nav) .card .tag{color:#f5ce8c}body:has(.catalog-nav) .card h3{color:#fff5df;font-weight:850;font-size:1.65rem;margin:7px 0}body:has(.catalog-nav) .card .card-scene{color:#eed4a2}body:has(.catalog-nav) .card p{color:#f1ede0;min-height:0;margin:4px 0 13px;line-height:1.5}body:has(.catalog-nav) .card .go{color:#f8d08d}body:has(.catalog-nav) .note{background:#eadfc7;border:1px solid #c9b28c;color:#4b5c50}body:has(.catalog-nav) .note strong{color:#a7332c}body:has(.catalog-nav) footer{border-color:#c5b698;color:#68776b}
@media(prefers-reduced-motion:reduce){.card{transition:none}}

body:not(.intl):has(#notice) .hero{display:flex;flex-direction:column;align-items:stretch;gap:24px;padding:24px 22px 34px}body:not(.intl):has(#notice) .hero>div:nth-child(2){order:-1}body:not(.intl):has(#notice) .hero .picture{aspect-ratio:4/3;border:3px solid #d8bb7d;box-shadow:5px 5px 0 #a7332c;border-radius:4px}body:not(.intl):has(#notice) .hero h1{font-size:2.2rem;color:#15332c;font-weight:850}body:not(.intl):has(#notice) .hero h2{font-size:1.3rem;color:#a7332c}body:not(.intl):has(#notice) .hero .actions>button:first-child{background:#a7332c;border-color:#a7332c;color:#fff;box-shadow:3px 3px 0 #dfc390}