/* Product-led hero and authentic production-view gallery. */
:root{--sage:#60764a;--paper-warm:#f5f3ea;--quiet-green:#e8ecdf}
.icon{mask-mode:alpha}
.icon-download{mask-image:url('assets/phosphor/download-simple.svg')}
.icon-arrow-right{mask-image:url('assets/phosphor/arrow-fat-right.svg')}
.icon-arrow-up-right{mask-image:url('assets/phosphor/arrow-up-right.svg')}
.icon-arrow-down{mask-image:url('assets/phosphor/arrow-fat-down.svg')}
.icon-check{mask-image:url('assets/phosphor/check-circle.svg')}
.icon-play{mask-image:url('assets/phosphor/play-circle.svg')}
.icon-plus{mask-image:url('assets/phosphor/plus-circle.svg')}
.icon-volume-2{mask-image:url('assets/phosphor/speaker-high.svg')}
.icon-bookmark{mask-image:url('assets/phosphor/bookmark-simple.svg')}
.icon-x{mask-image:url('assets/phosphor/x-circle.svg')}
.icon-cursor-text{mask-image:url('assets/phosphor/cursor-text.svg')}
.icon-book-open{mask-image:url('assets/phosphor/book-open-text.svg')}
.icon-cards{mask-image:url('assets/phosphor/cards.svg')}
.icon-expand{mask-image:url('assets/phosphor/arrows-out-simple.svg')}
.button .icon{width:21px;height:21px}
.text-link .icon{width:19px;height:19px}
.round-arrow{width:38px;height:38px;box-shadow:inset 0 1px 1px #fff,0 2px 3px #3c4a2913,0 6px 10px #3c4a2909}
.round-arrow .icon{width:22px;height:22px}
.reassurance .icon{width:19px;height:19px}
.hero{grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);align-items:center;gap:58px;padding-top:26px;padding-bottom:72px}
.hero-copy{padding-block:22px;animation:reveal-in .7s var(--ease) both}
.hero-kicker{display:flex;align-items:center;gap:9px;font-size:11px;letter-spacing:.08em;color:#69725e}
.hero-kicker img{width:17px;height:17px;opacity:.7}
.hero h1{font-family:"Songti SC","STSong","Noto Serif CJK SC",serif;font-size:clamp(43px,4.45vw,66px);font-weight:700;line-height:1.35;letter-spacing:-.055em;margin:25px 0 25px;white-space:nowrap}
.hero h1 span{color:#5e7944}
.hero-description{font-size:15px;line-height:2;color:#66705f}
.hero-actions{margin-top:30px;gap:25px}
.hero-copy>.fine-print{margin-top:14px;font-size:11px}
.hero-essentials{display:flex;flex-wrap:wrap;gap:17px;margin-top:34px;color:#77806b;font-size:10px}
.hero-essentials>span{display:inline-flex;align-items:center;gap:5px}
.hero-essentials .icon{width:17px;height:17px;color:#67824c}
.hero-visual{margin:0;min-width:0;animation:reveal-in .85s .08s var(--ease) both}
.hero-scene{position:relative;background:#e8eddf url('assets/paper-texture.png') center/480px;background-blend-mode:soft-light;border:1px solid #f6f8ee;border-radius:32px;box-shadow:inset 0 1px 0 #fff,0 2px 3px #3e4c2706,0 25px 45px -33px #40502c3a;padding:26px 20px 18px;overflow:hidden}
.scene-topline{display:flex;justify-content:space-between;gap:12px;padding:0 15px;font-size:10px;color:#6c7b5c;letter-spacing:.08em}
.scene-topline [lang]{font-size:8px;letter-spacing:.14em}
.hero-reader{width:87%;margin:27px auto 0;padding:23px 29px 50px;background:#fbfaf3 url('assets/paper-texture.png') center/430px;background-blend-mode:soft-light;border:1px solid #fff;border-radius:11px;box-shadow:0 1px 2px #39452208,0 9px 20px -11px #3c492d24;transform:rotate(-3deg)}
.reader-label{display:flex;align-items:center;gap:7px;font-size:9px;color:#8b8a77}
.reader-label .icon{width:16px;height:16px}
.hero-reader>p{font:clamp(24px,2.65vw,38px)/1.5 Georgia,"Times New Roman",serif;color:#505642;letter-spacing:-.045em;margin:19px 0 12px}
.hero-reader mark{background:#dbe5b9;color:inherit;padding:1px 4px;border-radius:3px;box-shadow:0 2px #abbc7b50}
.reader-translation{font-size:10px;color:#92917d}
.hero-interface{position:relative;display:block;width:100%;padding:0;margin:-46px auto -3px;background:transparent;border-radius:18px;cursor:zoom-in;transition:transform .35s var(--ease)}
.hero-interface:hover{transform:translateY(-3px)}
.hero-interface img{width:100%;height:auto}
.scene-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 14px;color:#637453;font-size:11px}
.scene-bottom>span{display:flex;align-items:center;gap:8px}
.scene-bottom .icon{width:21px;height:21px}
.scene-zoom{display:grid;place-items:center;min-width:36px;min-height:36px;border-radius:50%;background:#f7f9ee;color:#627449;box-shadow:inset 0 1px #fff,0 2px 4px #36452312;transition:transform .2s var(--ease)}
.scene-zoom:hover{transform:scale(1.08)}
.hero-visual figcaption{color:#87907c;text-align:center;font-size:10px;padding-top:13px;line-height:1.6}
.product-showcase{padding-top:24px;padding-bottom:76px;scroll-margin-top:30px}
.product-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:31px}
.product-heading h2{font:600 clamp(29px,3vw,41px)/1.4 "Songti SC","STSong",serif;letter-spacing:-.045em;margin-top:12px}
.product-heading>p{font-size:12px;line-height:1.9;color:#7a826f;margin-bottom:3px}
.product-heading .eyebrow{font-size:11px}
.product-layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:46px}
.product-navigation{padding-top:19px}
.product-tabs{display:flex;flex-direction:column;gap:11px}
.product-tabs>button{display:flex;align-items:center;gap:14px;width:100%;text-align:left;padding:17px 16px;border-radius:18px;background:transparent;transition:background .25s,box-shadow .25s,transform .25s var(--ease)}
.product-tabs>button:hover{background:#eef1e7}
.product-tabs>button[aria-selected=true]{background:#f8f8f1;box-shadow:inset 0 1px #fff,0 2px 4px #3446220b,0 12px 23px -10px #34462216}
.product-tab-icon{display:grid;place-items:center;flex:none;width:40px;height:40px;background:#edf1e5;border:1px solid #fff;border-radius:12px;box-shadow:0 2px 3px #3246220b;color:#66844f}
.product-tab-icon .icon{width:25px;height:25px}
.product-tabs strong{display:block;font-size:14px;font-weight:560}
.product-tabs small{display:block;font-size:10px;color:#7d8472;margin-top:3px}
.product-tabs>button>.icon{margin-left:auto;color:#5d7748;width:18px;height:18px;opacity:0;transform:translateX(-5px);transition:transform .25s,opacity .25s}
.product-tabs>button[aria-selected=true]>.icon{opacity:1;transform:translateX(0)}
.menu-entry{border-top:1px solid #e0e4d8;margin:30px 15px 0;padding-top:23px}
.menu-entry>img{width:22px;height:22px;opacity:.6;margin-bottom:12px}
.menu-entry h3{font-size:12px;font-weight:550}
.menu-entry p{font-size:11px;line-height:1.95;color:#77816c;margin:8px 0 9px}
.menu-entry .text-link{font-size:11px;color:#5d7549}
.product-panel{min-width:0;border-radius:26px;background:#eceee5;border:1px solid #f8faf0;box-shadow:inset 0 1px #fff;overflow:hidden}
.product-stage{display:flex;align-items:center;justify-content:center;position:relative;height:497px;padding:21px 26px 47px;background:url('assets/paper-texture.png') center/500px;background-blend-mode:soft-light}
.product-image-button{padding:0;background:transparent;cursor:zoom-in;max-width:100%;max-height:100%;display:flex;justify-content:center;align-items:center;border-radius:16px}
.product-image-button img{width:auto;height:auto;max-width:100%;max-height:425px;object-fit:contain;border-radius:12px}
.product-panel[data-screen=lookup] .product-image-button{width:100%}
.product-panel[data-screen=lookup] .product-image-button img{width:100%}
.product-panel[data-screen=wordbook] .product-image-button img,.product-panel[data-screen=review] .product-image-button img{box-shadow:0 2px 4px #3e4c2710,0 19px 25px -14px #3e4c2740}
.product-expand{position:absolute;bottom:14px;right:23px;display:flex;align-items:center;gap:7px;min-height:32px;background:#fafbf3;border:1px solid white;border-radius:30px;padding:5px 12px;box-shadow:0 2px 3px #3e4c270b;color:#64724f;font-size:10px}
.product-expand:hover{background:#fff}
.product-expand .icon{width:15px;height:15px}
.product-caption{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:111px;padding:22px 29px;background:#f2f3eb;border-top:1px solid #fafbf5}
.product-caption h3{font-size:13px;font-weight:550;line-height:1.7}
.product-caption p{font-size:11px;line-height:1.9;color:#78816d;margin-top:6px;max-width:510px}
.review-states{display:flex;gap:3px;flex:none;background:#e4e8d9;padding:3px;border-radius:30px}
.review-states button{background:transparent;border-radius:25px;padding:8px 11px;min-height:34px;font-size:10px;white-space:nowrap;color:#68785a;transition:background .25s,box-shadow .25s}
.review-states button[aria-pressed=true]{background:#fcfcf5;box-shadow:0 2px 3px #3c4e2c17;color:#3f6137}
.product-lightbox{width:min(1060px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);padding:24px 28px 18px;border:1px solid #fff;border-radius:25px;background:#f2f3eb;box-shadow:0 20px 100px #25352040;color:var(--ink);overflow:auto}
.product-lightbox[open]{animation:dialog-in .3s var(--ease)}
.product-lightbox::backdrop{background:#23301dd0;backdrop-filter:blur(8px)}
.lightbox-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:17px}
.lightbox-heading h2{font-size:21px;font-weight:550;margin-top:4px}
.lightbox-heading .eyebrow{font-size:10px}
.lightbox-heading .round-button{width:40px;height:40px}
.lightbox-image-wrap{min-width:0;overflow:auto;text-align:center}
.lightbox-image-wrap img{width:auto;max-width:100%;height:auto;max-height:calc(100dvh - 191px);margin:auto;object-fit:contain;border-radius:13px}
.lightbox-note{font-size:10px;line-height:1.7;text-align:center;color:#7d8571;margin-top:13px}
body:has(dialog[open]){overflow:hidden}
@media(min-width:1600px){.hero{gap:76px;padding-top:41px;padding-bottom:82px}.hero-scene{padding-top:32px}.hero-reader{margin-top:34px}}
@media(max-width:1100px){.hero{gap:30px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}.hero h1{font-size:clamp(37px,4.3vw,50px)}.hero-description{font-size:13px}.hero-actions{gap:17px}.hero-actions .button{padding-inline:18px;gap:14px}.hero-essentials{gap:10px;font-size:9px}.hero-scene{padding:21px 12px 14px;border-radius:26px}.scene-topline{padding:0 11px}.scene-topline [lang]{display:none}.hero-reader{width:91%;padding:19px 23px 49px}.hero-reader>p{font-size:29px}.hero-interface{margin-top:-40px}.scene-bottom{font-size:10px;padding-inline:10px}.product-layout{grid-template-columns:260px minmax(0,1fr);gap:28px}.product-stage{height:470px;padding-inline:18px}.product-image-button img{max-height:399px}.product-caption{padding:21px}.product-caption:has(.review-states:not([hidden])){flex-direction:column;align-items:start}.product-tabs>button{padding-inline:12px}}
@media(max-width:820px){.hero{grid-template-columns:1fr;gap:31px;padding-top:22px;padding-bottom:53px}.hero-copy{padding:0}.hero h1{font-size:52px;line-height:1.28;margin-block:20px}.hero-description{font-size:14px}.hero-description br:first-of-type{display:none}.hero-actions{margin-top:23px;flex-wrap:nowrap}.hero-essentials{margin-top:23px;font-size:11px;gap:23px}.hero-visual{max-width:620px;width:100%;justify-self:center}.hero-scene{padding:25px 24px 17px}.scene-topline [lang]{display:inline}.hero-reader{width:85%;padding:24px 30px 58px}.hero-reader>p{font-size:35px}.hero-interface{margin-top:-43px}.product-heading>p{font-size:11px}.product-layout{grid-template-columns:1fr;gap:22px}.product-navigation{display:contents}.product-tabs{flex-direction:row;gap:10px}.product-tabs>button{padding:14px 11px;gap:10px;flex:1;min-width:0}.product-tabs>button>.icon{display:none}.product-tabs strong{font-size:12px}.product-tabs small{font-size:9px}.product-tab-icon{width:33px;height:33px;border-radius:10px}.product-tab-icon .icon{width:22px;height:22px}.menu-entry{grid-row:3;margin:4px 4px 0;padding-top:21px;display:grid;grid-template-columns:26px 1fr;gap:0 12px}.menu-entry>img{grid-row:1/4;margin-top:1px}.menu-entry h3{font-size:13px}.menu-entry p{margin-top:6px;max-width:520px}.menu-entry .text-link{grid-column:2}.product-stage{height:492px;padding-inline:28px}.product-image-button img{max-height:420px}.product-caption:has(.review-states:not([hidden])){flex-direction:row;align-items:center}.product-showcase{padding-top:14px;padding-bottom:53px}.product-heading{margin-bottom:23px}}
@media(max-width:640px){.button .icon{width:20px;height:20px}.hero{gap:28px;padding-top:16px;padding-bottom:42px}.hero h1{font-size:clamp(37px,9.4vw,52px);margin:20px 0 19px;letter-spacing:-.065em}.hero-kicker{font-size:10px}.hero-description{font-size:13px;line-height:1.95}.hero-description br:first-of-type{display:initial}.hero-actions{margin-top:24px;gap:20px}.hero-actions .button{min-height:49px;padding-inline:21px;font-size:12px;gap:19px}.hero-actions .text-link{font-size:11px;gap:8px}.hero-copy>.fine-print{font-size:10px;margin-top:12px}.hero-essentials{gap:15px;font-size:9px;margin-top:21px}.hero-essentials .icon{width:16px;height:16px}.hero-scene{padding:20px 10px 11px;border-radius:24px}.scene-topline{font-size:8px;padding:0 14px}.scene-topline [lang]{font-size:7px}.hero-reader{width:88%;margin-top:23px;padding:18px 24px 43px}.hero-reader>p{font-size:clamp(23px,6.3vw,33px);margin-top:16px;margin-bottom:10px}.reader-label{font-size:8px}.reader-translation{font-size:8px}.hero-interface{margin-top:-30px;margin-bottom:0}.scene-bottom{font-size:9px;padding:0 12px}.scene-bottom .icon{width:18px;height:18px}.scene-zoom{min-width:32px;min-height:32px}.hero-visual figcaption{font-size:9px;padding-top:10px}.product-heading{align-items:start;gap:0}.product-heading h2{font-size:clamp(26px,6.5vw,33px);margin-top:10px}.product-heading .eyebrow{font-size:10px}.product-heading>p{display:none}.product-tabs{gap:6px}.product-tabs>button{flex-direction:column;justify-content:center;gap:8px;text-align:center;padding:12px 4px;border-radius:14px;min-height:90px}.product-tabs strong{font-size:11px}.product-tabs small{display:none}.product-tab-icon{width:32px;height:32px}.product-layout{gap:18px}.product-panel{border-radius:20px}.product-stage{height:360px;padding:17px 12px 44px}.product-image-button img{max-height:295px;border-radius:9px}.product-expand{bottom:11px;right:13px;font-size:9px}.product-caption{padding:18px;min-height:117px}.product-caption h3{font-size:12px}.product-caption p{font-size:10px;line-height:1.9}.product-caption:has(.review-states:not([hidden])){flex-direction:column;align-items:start;gap:13px}.review-states button{padding-inline:13px;font-size:11px;min-height:36px}.menu-entry{margin-top:7px}.menu-entry h3{font-size:12px}.menu-entry p{font-size:11px}.menu-entry .text-link{font-size:11px}.product-showcase{padding-bottom:43px}.reassurance .icon{width:16px;height:16px}.round-arrow{width:31px;height:31px}.round-arrow .icon{width:19px;height:19px}.product-lightbox{padding:20px 17px 15px;border-radius:20px}.lightbox-heading h2{font-size:18px}.lightbox-image-wrap{max-height:calc(100dvh - 184px)}.lightbox-image-wrap img{max-height:none;max-width:none;width:650px}.lightbox-heading .eyebrow{font-size:9px}.lightbox-note{font-size:10px;text-align:left}.lightbox-heading .round-button{width:37px;height:37px}}
@media(max-width:360px){.hero-actions{gap:13px}.hero-actions .button{padding-inline:16px;gap:12px}.hero-actions .text-link{font-size:10px}.hero-essentials{gap:11px;font-size:8px}.scene-topline [lang]{display:none}.product-stage{height:324px}.product-image-button img{max-height:263px}}
@media(prefers-reduced-motion:reduce){.hero-interface:hover,.scene-zoom:hover{transform:none}}

/* Keep explanations readable at both viewing sizes. */
.product-caption h3{font-size:14px}.product-caption p,.menu-entry p{font-size:12px;color:#66715c}.product-tabs small{font-size:11px}.lightbox-mobile-hint{display:none}
@media(max-width:640px){.product-caption h3{font-size:13px}.product-caption p,.menu-entry p{font-size:11px}.lightbox-mobile-hint{display:inline}.lightbox-image-wrap{max-height:calc(100dvh - 200px)}}
.hero-essentials,.hero-visual figcaption{color:#65715b}.product-tabs small{color:#68745d}.reader-translation{color:#737962}
