/* Hallmark · macrostructure: Workbench · tone: bright pastoral game journal · anchor hue: grass green
 * theme: custom (user bright-pastoral override) · paper: oklch(97% .014 90) · accent: oklch(87% .135 89)
 * display: Songti SC · body: PingFang SC · axes: light / roman-serif / yellow
 * nav: compact brand bar · footer: mast-headed · enrichment: verified game screenshots
 */
/* Hallmark · pre-emit critique: P4 H4 E4 S5 R4 V5 */
@import url('tokens.css');
*{box-sizing:border-box}html,body{margin:0;overflow-x:clip}html{scroll-padding-top:var(--space-lg)}body{background:var(--color-paper);color:var(--color-ink);font-family:var(--font-body);line-height:1.75;padding-bottom:100px}a{color:inherit;text-decoration:none}p a{color:var(--color-green);text-decoration:underline;text-underline-offset:4px}button,a,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}a:hover{color:var(--color-green)}a:active,button:active{opacity:.85}button:disabled,[aria-disabled=true]{opacity:.45;cursor:not-allowed}img{display:block;max-width:100%;height:auto}h1,h2,h3{font-family:var(--font-display);font-style:normal;font-weight:700;line-height:1.35;overflow-wrap:anywhere;min-width:0}h1,h2,h3,p,figure{margin:0}h2{font-size:var(--text-xl)}h3{font-size:1.4rem}p{color:var(--color-muted);margin-top:var(--space-md)}small,.fine{font-size:var(--text-sm);color:var(--color-muted)}.wrap{width:min(1240px,calc(100% - 96px));margin-inline:auto}.skip{position:absolute;left:var(--space-md);top:-80px;z-index:100;background:var(--color-accent);padding:var(--space-md)}.skip:focus{top:var(--space-md)}.site-header{border-bottom:1px solid var(--color-rule);background:var(--color-panel)}.nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--space-xl);min-height:88px}.brand{display:flex;align-items:center;gap:var(--space-sm);font-size:1.1rem;font-weight:700;white-space:nowrap}.brand img{border-radius:50%;border:1px solid var(--color-rule);width:44px;height:44px;object-fit:cover}.brand small{display:block;font-size:.65rem;font-weight:400;letter-spacing:.06em}.nav-wrap nav{display:flex;gap:var(--space-xl);font-size:.875rem}.nav-wrap nav a{padding-block:var(--space-sm);white-space:nowrap}.nav-wrap nav a[aria-current]{color:var(--color-green);border-bottom:2px solid var(--color-green);font-weight:700}.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-lg);padding:12px 24px;border:1px solid var(--color-green);border-radius:var(--radius-sm);font-weight:700;white-space:nowrap;background:var(--color-panel);box-shadow:0 3px 0 var(--color-green);transition:transform var(--dur-fast) var(--ease-out);line-height:1.5}.button.primary{background:var(--color-accent);color:var(--color-ink)}.button:hover{background:var(--color-wash)}.button.primary:hover{background:var(--color-accent-hover)}.button:active{transform:translateY(2px);box-shadow:0 1px 0 var(--color-green);opacity:1}.nav-cta .button{padding:10px 16px;font-size:.8125rem}.hero{padding-top:var(--space-2xl)}.hero-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:var(--space-xl);gap:var(--space-lg)}.hero-heading h1{font-size:var(--text-display);margin-top:var(--space-sm)}h1 small{font-family:var(--font-body);display:block;font-size:.875rem;letter-spacing:.06em;margin-top:var(--space-sm);font-weight:400}.hero-heading>p{text-align:right;font-size:.95rem;margin-bottom:var(--space-sm)}.tag{display:inline-block;font-size:.75rem;color:var(--color-green);background:var(--color-wash);padding:4px 12px;border-radius:2px}.tag.soft{background:var(--color-pink)}.hero-grid{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(0,1fr);gap:var(--space-lg);align-items:stretch}.scene{align-self:start;border:1px solid var(--color-green);padding:var(--space-sm);background:var(--color-panel);box-shadow:5px 5px 0 var(--color-wash);transform:rotate(-.5deg)}.hero-image{display:block;background:var(--color-green)}.hero-image img{width:100%;aspect-ratio:16/9;object-fit:contain}.scene-caption{display:flex;justify-content:space-between;gap:var(--space-sm);align-items:center;padding:var(--space-md) var(--space-sm);font-size:.8rem}.scene-caption a{white-space:nowrap}.game-panel{border:1px solid var(--color-rule);background:var(--color-panel);padding:var(--space-md)}.cover{width:160px;float:right;margin:0 0 var(--space-md) var(--space-md);border-radius:2px}.panel-copy h2{font-size:1.5rem;line-height:1.6}.panel-copy>p{font-size:.875rem;clear:both;margin-top:var(--space-md)}.tags{display:flex;flex-wrap:wrap;gap:var(--space-sm);margin-block:var(--space-md)}.tags span{border:1px solid var(--color-rule);padding:4px 8px;font-size:.75rem}.panel-copy .button{width:100%;margin-top:var(--space-sm)}.text-link{font-size:.875rem;text-decoration:underline;text-underline-offset:5px}.panel-copy>.text-link{display:block;text-align:center;margin-top:var(--space-md)}.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:var(--space-xl);padding:var(--space-lg) 0;border-block:1px solid var(--color-rule)}.facts>div{padding-inline:var(--space-lg);border-right:1px solid var(--color-rule)}.facts>div:first-child{padding-left:0}.facts>div:last-child{border:0}.facts span{display:block;font-size:.75rem;color:var(--color-muted);margin-bottom:var(--space-xs)}.facts strong{font-size:.875rem;font-weight:500}.section{padding-block:var(--space-4xl)}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--space-lg);margin-bottom:var(--space-xl)}.section-heading p{margin-top:var(--space-sm)}.story-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:var(--space-xl)}.story-main{background:var(--color-panel);border:1px solid var(--color-rule)}.story-main img{width:100%;aspect-ratio:16/9;object-fit:contain;background:var(--color-green)}.story-main>div{padding:var(--space-lg)}.story-main p,.story-side p{font-size:.9rem}.story-side{display:flex;flex-direction:column;background:var(--color-wash);position:relative;padding:var(--space-lg);gap:var(--space-lg)}.story-side img{aspect-ratio:16/9;object-fit:contain;width:100%;border:1px solid var(--color-rule)}.story-side h3{margin-top:var(--space-sm)}.gallery-section{background:var(--color-wash);border-block:1px solid var(--color-rule)}.thumb-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-md)}.thumb-grid a{display:block;background:var(--color-panel);padding:var(--space-sm);border:1px solid var(--color-rule)}.thumb-grid img{aspect-ratio:16/9;object-fit:contain;background:var(--color-green)}.thumb-grid span{display:block;font-size:.85rem;padding:var(--space-sm)}.gallery-link{cursor:zoom-in}.gallery-link:focus-visible{outline-offset:2px}.faq-section{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:var(--space-3xl)}.faq-section>.faqs{min-width:0}.faq-section>.faqs p{margin-top:0}.faq-section .text-link{display:inline-block;margin-top:var(--space-lg)}details{border-bottom:1px solid var(--color-rule)}summary{cursor:pointer;padding:var(--space-lg) var(--space-xl) var(--space-lg) 0;position:relative;list-style:none;font-weight:600}summary::-webkit-details-marker{display:none}summary:after{content:'+';position:absolute;right:var(--space-xs);font-size:1.3rem;top:20px;color:var(--color-green)}details[open]>summary:after{content:'−'}details p{padding-bottom:var(--space-lg);font-size:.925rem}summary:hover{color:var(--color-green)}summary:active{opacity:.7}.final-section{display:flex;align-items:center;justify-content:space-between;gap:var(--space-xl);padding:var(--space-2xl);background:var(--color-wash);border:1px solid var(--color-rule);margin-bottom:var(--space-3xl)}.final-section h2{margin-top:var(--space-sm)}.final-section p{margin-top:var(--space-sm)}footer{padding-block:var(--space-xl)}.footer-top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-lg)}.footer-nav{display:flex;flex-wrap:wrap;gap:var(--space-lg);font-size:.8rem}.footer-nav a,.related a{white-space:nowrap}.related{display:flex;flex-wrap:wrap;gap:var(--space-md);border-block:1px solid var(--color-rule);padding-block:var(--space-lg);margin-top:var(--space-lg);font-size:.75rem}.related>span{color:var(--color-muted)}.bottom-bar{position:fixed;bottom:0;left:0;right:0;background:var(--color-panel);border-top:1px solid var(--color-rule);z-index:20;padding:var(--space-md) 0;box-shadow:0 -4px 24px var(--color-wash)}.bottom-bar>.wrap{display:flex;justify-content:space-between;align-items:center;gap:var(--space-md)}.bottom-bar strong{font-family:var(--font-display);font-size:1.15rem}.bottom-bar span{display:block;font-size:.75rem;color:var(--color-muted)}.bottom-bar .button span{color:inherit;font-size:1rem}.subpage{padding-top:var(--space-xl)}.breadcrumb{display:flex;gap:var(--space-md);font-size:.8rem;color:var(--color-muted)}.breadcrumb a{white-space:nowrap}.page-heading{margin:var(--space-2xl) 0}.page-heading h1{font-size:var(--text-display);margin-top:var(--space-md)}.page-heading p{max-width:65ch}.download-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:var(--space-3xl);align-items:start}.download-panel{padding:var(--space-xl);border:1px solid var(--color-rule);background:var(--color-panel)}.download-panel>img{max-width:100%;margin-bottom:var(--space-lg)}.download-panel .button{margin-top:var(--space-lg)}table{width:100%;border-collapse:collapse;margin-block:var(--space-lg);text-align:left;font-size:.9rem}caption{text-align:left;font-size:.75rem;color:var(--color-muted);margin-bottom:var(--space-sm)}th,td{border-bottom:1px solid var(--color-rule);padding:var(--space-md) var(--space-sm)}thead{background:var(--color-wash)}.note{background:var(--color-wash);padding:var(--space-lg);margin-top:var(--space-xl)}.note h2{font-size:1.7rem}.prose{max-width:68ch}.prose section{margin-bottom:var(--space-2xl)}.prose h2{font-size:1.9rem;margin-bottom:var(--space-lg)}.prose h3{margin-top:var(--space-lg)}.prose img{margin-block:var(--space-lg);border:1px solid var(--color-rule)}.prose ol,.prose ul{padding-left:var(--space-lg);color:var(--color-muted)}.prose li{margin-bottom:var(--space-md)}.steps li{padding-left:var(--space-sm)}.guide-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:var(--space-3xl)}.guide-toc{display:flex;flex-direction:column;align-self:start;gap:var(--space-md);position:sticky;top:var(--space-lg);padding:var(--space-lg);border:1px solid var(--color-rule);font-size:.875rem}.guide-toc a{white-space:nowrap}.filters{display:flex;flex-wrap:wrap;gap:var(--space-sm)}.filters[hidden]{display:none}.filters button,dialog button{background:var(--color-panel);border:1px solid var(--color-rule);padding:8px 16px;color:var(--color-ink);white-space:nowrap;border-radius:var(--radius-sm)}.filters button:hover,dialog button:hover{background:var(--color-wash)}.filters button[aria-pressed=true]{background:var(--color-green);color:var(--color-panel)}.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-lg);margin-block:var(--space-lg) var(--space-3xl)}.gallery-grid figure{border:1px solid var(--color-rule);padding:var(--space-sm);background:var(--color-panel)}.gallery-grid figure[hidden]{display:none}.gallery-grid img{aspect-ratio:16/9;object-fit:contain;background:var(--color-green)}figcaption{display:flex;justify-content:space-between;gap:var(--space-sm);padding:var(--space-sm);font-size:.9rem}figcaption span{color:var(--color-muted);font-size:.75rem}dialog{width:min(1050px,96vw);max-height:94dvh;padding:var(--space-md);border:1px solid var(--color-rule);background:var(--color-paper);color:var(--color-ink);overflow:auto}dialog::backdrop{background:var(--color-overlay)}.dialog-tools,.dialog-bottom{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);font-size:.8rem}.dialog-tools{margin-bottom:var(--space-md)}#large-image{width:100%;max-height:68dvh;object-fit:contain}#image-caption{margin:var(--space-sm) 0}.dialog-bottom span{font-size:.75rem}dialog[data-state=loading] #large-image{opacity:.4}dialog[data-state=error] #image-error{color:var(--color-error)}dialog[data-state=success] #large-image{opacity:1}
@media(min-width:1500px){.hero-grid{grid-template-columns:minmax(0,1.85fr) minmax(0,1fr)}}
@media(max-width:1100px){.wrap{width:calc(100% - 64px)}.nav-wrap{gap:var(--space-md)}.nav-wrap nav{gap:var(--space-lg)}.nav-cta{display:none}.cover{width:115px}.panel-copy h2{font-size:1.3rem}.game-panel{padding:var(--space-md)}.panel-copy>p{font-size:.8rem}.panel-copy .button{padding-inline:var(--space-sm)}.facts>div{padding-inline:var(--space-md)}.hero-grid{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}}
@media(max-width:800px){.wrap{width:calc(100% - 40px)}.nav-wrap{flex-wrap:wrap;padding-block:var(--space-md);gap:var(--space-md)}.nav-wrap nav{width:100%;justify-content:space-between;font-size:.8125rem;gap:var(--space-sm)}.hero{padding-top:var(--space-xl)}.hero-heading{display:block}.hero-heading>p{text-align:left}.hero-grid{grid-template-columns:minmax(0,1fr)}.game-panel{display:grid;grid-template-columns:160px minmax(0,1fr);gap:var(--space-lg);padding:var(--space-lg)}.cover{float:none;width:160px;margin:0}.panel-copy h2{font-size:1.5rem}.panel-copy h2 br{display:none}.panel-copy>p{font-size:.9rem}.facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-lg)}.facts>div:nth-child(3){padding-left:0}.facts>div:nth-child(2){border:0}.section{padding-block:var(--space-2xl)}.section-heading{display:block}.section-heading>.text-link{display:inline-block;margin-top:var(--space-md)}.story-grid{gap:var(--space-lg)}.thumb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.faq-section{grid-template-columns:minmax(0,1fr);gap:var(--space-xl)}.faq-section h2 br{display:none}.final-section{padding:var(--space-xl);flex-wrap:wrap}.footer-top{flex-wrap:wrap}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.download-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-xl)}.guide-layout{grid-template-columns:minmax(0,1fr);gap:var(--space-xl)}.guide-toc{position:static;flex-direction:row;flex-wrap:wrap;gap:var(--space-md)}.guide-toc strong{width:100%}.prose{max-width:100%}}
@media(max-width:500px){.hero-heading h1{font-size:2.45rem}.hero-heading>p{font-size:.875rem}.game-panel{grid-template-columns:minmax(0,1fr);padding:var(--space-lg)}.game-panel>.cover{display:none}.panel-copy h2{font-size:1.35rem}.panel-copy h2 br{display:none}.panel-copy>p{font-size:.875rem}.hero-grid .scene{order:2}.scene-caption{font-size:.68rem;padding:var(--space-sm) 0}.hero-heading{margin-bottom:var(--space-lg)}.facts{font-size:.8rem}.facts strong{font-size:.8rem}.story-grid{grid-template-columns:minmax(0,1fr)}.story-side{padding:var(--space-md)}.bottom-bar{padding:12px 0 calc(12px + env(safe-area-inset-bottom))}.bottom-bar strong{font-size:.85rem;font-family:var(--font-body)}.bottom-bar strong{display:none}.bottom-bar span{font-size:.65rem;max-width:100px}.bottom-bar .button{padding:12px;font-size:.8125rem;gap:var(--space-sm)}.gallery-grid{grid-template-columns:minmax(0,1fr)}.section-heading h2{font-size:1.9rem}.final-section{padding:var(--space-lg)}.final-section h2{font-size:1.7rem}.footer-nav{gap:var(--space-md)}.page-heading{margin-block:var(--space-xl)}.page-heading h1{font-size:2.3rem}.download-panel{padding:var(--space-lg)}.download-grid table{font-size:.8rem}.dialog-bottom{gap:var(--space-sm)}.dialog-bottom span{display:none}.prose h2{font-size:1.6rem}.thumb-grid{gap:var(--space-sm)}.thumb-grid span{padding:var(--space-xs);font-size:.75rem}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}.button:active{transform:none}.scene{transform:none}}

/* Additive SEO article system; existing pastoral tokens and page design preserved. */
.article-category-section{padding-block:var(--space-xl);border-top:1px solid var(--color-rule)}.article-category-section>h2{margin-bottom:var(--space-lg)}.article-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-lg)}.article-list>article{padding:var(--space-lg);background:var(--color-panel);border:1px solid var(--color-rule)}.article-category{font-size:.75rem;color:var(--color-muted);display:block;margin-bottom:var(--space-sm)}.article-list h2,.article-list h3{font-size:1.35rem;line-height:1.65}.article-list h2 a:hover,.article-list h3 a:hover{text-decoration:underline;text-underline-offset:4px}.article-list p{font-size:.9rem}.article-list .text-link{display:inline-block;margin-top:var(--space-md);white-space:nowrap}.topic-nav{display:flex;flex-wrap:wrap;gap:var(--space-md);margin-bottom:var(--space-xl)}.topic-nav a{padding:var(--space-sm) var(--space-md);background:var(--color-wash);white-space:nowrap}.article-page .page-heading{max-width:900px}.article-page h1{font-size:clamp(1.9rem,3.2vw,3rem);line-height:1.45}.article-date{font-size:.8125rem}.article-answer{font-size:1.05rem}.article-page .guide-toc a{white-space:normal;line-height:1.8}.article-page .guide-toc a:last-child{white-space:nowrap}.article-photo{margin-bottom:var(--space-xl)}.article-photo figcaption{display:block;font-size:.8rem;color:var(--color-muted);padding:0}.article-page .prose{max-width:68ch}.article-page .prose p{line-height:1.95}.source-note{border-top:1px solid var(--color-rule);padding-top:var(--space-lg);margin-bottom:var(--space-xl);font-size:.8rem}.source-note h2{font-size:1.25rem}.source-note ul{margin-top:var(--space-md)}.source-note li{margin-bottom:var(--space-sm)}.article-next{background:var(--color-wash);padding:var(--space-lg)}.article-next h2{font-size:1.4rem}.article-next a{text-decoration:underline;text-underline-offset:4px}.guide-articles-entry{padding:var(--space-lg);background:var(--color-wash);margin-bottom:var(--space-xl)}.guide-articles-entry h2{font-size:1.5rem}
@media(max-width:800px){.nav-wrap nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-sm)}.nav-wrap nav a{justify-self:start}.article-page .guide-toc{display:block}.article-page .guide-toc a{display:block;margin-top:var(--space-sm)}.article-page .prose{max-width:100%}}
@media(max-width:550px){.article-list{grid-template-columns:minmax(0,1fr)}.article-list>article{padding:var(--space-md)}.article-page .page-heading{margin-block:var(--space-xl)}.article-page .page-heading h1{font-size:1.9rem}.article-page .prose h2{font-size:1.5rem}.article-answer{font-size:.95rem}}
