html{scrollbar-gutter:stable}
:root{color-scheme:dark;--cream:#faecd9;--gold:#dec69c;--page-h:570px;--page-w:403px;--book-width:806px;--book-shift:0px;font-family:"Noto Sans TC","Microsoft JhengHei",system-ui,sans-serif;color:var(--cream)}
*{box-sizing:border-box}body{margin:0;min-height:100svh;background-color:#513426;background-image:radial-gradient(ellipse at 50% 48%,#5e372800 12%,#1e100b91 100%),linear-gradient(#29140932,#29140932),url("assets/walnut.webp");background-size:cover,cover,1536px auto;background-attachment:fixed}button,a,select{-webkit-tap-highlight-color:transparent}button,select{font:inherit}button{color:inherit;cursor:pointer}button:disabled{opacity:.25;cursor:default}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #f7d895;outline-offset:5px}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}[hidden]{display:none!important}
.topbar{display:flex;justify-content:space-between;align-items:center;max-width:1440px;padding:26px 44px;margin:auto;gap:20px}.brand{display:flex;align-items:center;gap:19px}.brand-logo{display:flex;align-items:center;flex-shrink:0;padding:7px 5px;background:#fffdf9;border-radius:5px;line-height:0}.brand-logo img{display:block;width:144px;height:auto;object-fit:contain}.brand-divider{width:1px;height:35px;background:#e8ceb94d}.brand-title{margin:0;font-size:15px;font-weight:600;letter-spacing:.08em;line-height:1.6}.brand-title span{display:block;font-size:12px;font-weight:400;letter-spacing:.22em;color:#e8ccb3}.official-link{display:flex;align-items:center;gap:10px;border:1px solid #e9c79977;background:#27120a4d;border-radius:6px;padding:12px 17px;font-size:14px;transition:background .2s}.official-link:hover{background:#a41924}.official-link svg{width:17px;height:17px}
.reader{display:flex;flex-direction:column;align-items:center;padding:5px 20px 0}.book-stage{position:relative;width:min(100%,1240px);height:var(--page-h);display:flex;justify-content:center;align-items:center}.book-position{position:relative;width:var(--book-width);height:var(--page-h);transform:translateX(var(--book-shift));transition:transform .55s ease;filter:drop-shadow(0 20px 22px #180b09a3)}.book{width:var(--book-width);height:var(--page-h)}.dm-page{background:#f7e9d5;overflow:hidden}.dm-page img{display:block;width:100%;height:100%;object-fit:fill;user-select:none;-webkit-user-drag:none}.dm-page::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px #00000009}.side-arrow{position:absolute;z-index:20;top:50%;transform:translateY(-50%);width:48px;height:48px;display:grid;place-items:center;border:1px solid #e8ceb940;border-radius:50%;background:#2f170b45;transition:background .2s}.side-arrow:hover:not(:disabled){background:#7c241eee}.side-arrow.previous{left:16px}.side-arrow.next{right:16px}.loading{position:absolute;inset:0;z-index:25;display:flex;align-items:center;justify-content:center;gap:14px;background:#42281bea;letter-spacing:.15em;font-size:15px}.spinner{width:23px;height:23px;border:2px solid #dec69c44;border-top-color:var(--gold);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.load-error{position:absolute;inset:0;z-index:26;display:grid;place-content:center;text-align:center;background:#42281b}.load-error button{padding:10px 20px;border:1px solid var(--gold);border-radius:5px;background:#a71926}
.reader-toolbar{display:flex;align-items:center;gap:11px;margin-top:27px;padding:8px 13px;background:#28150dd6;border:1px solid #cfaa7c4a;border-radius:9px;box-shadow:0 6px 15px #190c0a26;backdrop-filter:blur(10px)}.toolbar-arrow{display:grid;place-items:center;border:0;background:transparent;width:38px;height:36px;border-radius:5px}.toolbar-arrow:hover:not(:disabled),.zoom-button:hover{background:#a779403b}.page-control{display:flex;align-items:center;gap:7px}.page-control select{background:transparent;color:var(--cream);border:0;font-size:15px;min-width:44px;padding:8px 0;cursor:pointer}.page-control option{background:#362016}.page-total{font-family:Arial,sans-serif;font-size:14px;color:#cfbda8;white-space:nowrap}.toolbar-divider{width:1px;height:23px;background:#ccb38f3d;margin:0 4px}.zoom-button{display:flex;align-items:center;gap:8px;border:0;border-radius:5px;background:transparent;padding:8px 10px;font-size:14px}.zoom-button svg{width:18px;height:18px}.reader-hint{color:#e2c6ad;font-size:12px;letter-spacing:.04em;margin:14px 0 0}.mobile-hint{display:none}footer{text-align:center;font-size:11px;letter-spacing:.1em;color:#d2b398;padding:25px 15px 22px}footer span{font:10px Arial,sans-serif;letter-spacing:.16em;margin-left:8px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
dialog{border:1px solid #806447;border-radius:10px;padding:0;background:#1d1713;color:var(--cream);width:min(1100px,96vw);max-width:96vw;height:94svh;max-height:94svh;overflow:hidden}dialog::backdrop{background:#100805dd;backdrop-filter:blur(5px)}dialog[open]{display:flex;flex-direction:column}.zoom-toolbar{display:flex;align-items:center;justify-content:space-between;padding:10px 15px;border-bottom:1px solid #c3a17433;gap:8px;font-size:14px}.zoom-toolbar>div{display:flex;align-items:center;gap:8px}.zoom-toolbar button{border:1px solid #c7a16b50;background:#3e2d20;border-radius:5px;width:36px;height:36px;font-size:22px}.zoom-toolbar .zoom-close{margin-left:12px;font-size:18px}.zoom-toolbar #zoom-level{font-size:12px;min-width:40px;text-align:center}.zoom-scroll{flex:1;overflow:auto;overscroll-behavior:contain;background:#17120f;touch-action:pan-x pan-y pinch-zoom;padding:18px;text-align:center}.zoom-scroll img{height:auto;max-width:none;display:block;margin:0 auto;box-shadow:0 6px 25px #0007}.zoom-navigation{display:flex;justify-content:center;align-items:center;gap:30px;padding:10px;border-top:1px solid #c3a17433;font-size:14px}.zoom-navigation button{border:1px solid #c7a16b50;border-radius:5px;background:#3e2d20;padding:8px 15px}.noscript{position:fixed;inset:30% 10%;padding:20px;background:#4b2017}.noscript a{display:block;text-decoration:underline;margin-top:15px}
@media(min-width:769px) and (max-height:850px){.topbar{padding-top:20px;padding-bottom:17px}.reader-toolbar{margin-top:20px}footer{padding-top:18px}}
@media(max-width:768px){body{background-size:cover,cover,1100px auto;background-attachment:scroll}.topbar{padding:12px max(10px,env(safe-area-inset-right)) 14px max(10px,env(safe-area-inset-left));padding-top:max(12px,env(safe-area-inset-top));gap:10px}.brand{gap:8px}.brand-logo{padding:6px 3px}.brand-logo img{width:96px}.brand-divider{display:none}.brand-title{font-size:12px;letter-spacing:.03em;white-space:nowrap}.brand-title span{font-size:9px;letter-spacing:.13em}.official-link{padding:10px 11px;font-size:12px;gap:5px;white-space:nowrap}.official-link svg{width:15px;height:15px}.reader{padding:0 max(6px,env(safe-area-inset-right)) 0 max(6px,env(safe-area-inset-left))}.side-arrow{display:none}.book-position{filter:drop-shadow(0 14px 14px #150a08aa)}.reader-toolbar{margin-top:14px;gap:6px;padding:4px 8px}.toolbar-arrow{width:44px;height:44px}.zoom-button{min-height:44px}.reader-hint{font-size:11px;margin-top:10px}.desktop-hint{display:none}.mobile-hint{display:inline}footer{padding:16px 10px max(14px,env(safe-area-inset-bottom));font-size:10px}dialog{width:100vw;max-width:100vw;height:100svh;max-height:100svh;border:0;border-radius:0}.zoom-toolbar{padding-top:max(10px,env(safe-area-inset-top))}.zoom-navigation{padding-bottom:max(10px,env(safe-area-inset-bottom))}.zoom-scroll{padding:10px}}
@media(max-width:360px){.brand-divider{display:none}.brand-logo img{width:88px}.brand-title{font-size:11px}.official-link{font-size:11px}.reader-toolbar{gap:5px}.zoom-button{padding-inline:6px}}
@media(prefers-reduced-motion:reduce){.book-position{transition:none}.spinner{animation:none}*{scroll-behavior:auto!important}}



.store-contact{width:min(100%,960px);margin:28px auto 0;text-align:left}
.store-contact h2{margin:0 0 16px;font-size:20px;font-weight:600;letter-spacing:.1em;color:var(--cream)}
.store-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.store-card{display:flex;flex-direction:column;min-width:0;padding:22px;background:#3b1812e8;border:1px solid #dec69c55;border-radius:9px;box-shadow:0 5px 18px #190c0a2b}
.store-card h3{margin:0 0 10px;color:var(--gold);font-size:18px;font-weight:600;line-height:1.5}
.store-card address{font-size:16px;font-style:normal;line-height:1.7;overflow-wrap:anywhere;user-select:text}
.store-note{display:block;color:#dfc2a9;font-size:14px}
.store-phone{align-self:flex-start;margin:12px 0 16px;font:18px/1.5 Arial,sans-serif;letter-spacing:.04em;user-select:text}
.store-phone:hover{text-decoration:underline;text-underline-offset:4px}
.store-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:auto}
.store-action{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 8px;border:1px solid #dec69c77;border-radius:5px;font-size:14px;line-height:1.4;transition:background .2s}
.store-action svg{flex-shrink:0;width:18px;height:18px}.store-call{background:#a71927;border-color:#d9545d88}.store-call:hover{background:#c21e2e}.store-map{background:#ead3ad14}.store-map:hover{background:#ead3ad2b}
.zoom-scroll .store-contact{margin-top:26px;margin-bottom:12px}.zoom-scroll .store-card{box-shadow:none;background:#2d211b}
@media(max-width:640px){.store-grid{grid-template-columns:1fr}.store-contact{margin-top:24px}.store-contact h2{font-size:18px;margin-bottom:14px}.store-card{padding:18px}.store-actions{gap:8px}}