:root { color-scheme: dark; --bg:#10121c; --ink:#fff4dc; --muted:#d2c8ba; --gold:#ebc47d; --gold-light:#ffedbf; --gold-soft:rgba(235,196,125,.45); --panel:rgba(12,17,31,.8); --ring:rgba(255,224,167,.75); --safe-top:env(safe-area-inset-top,0px); --safe-bottom:env(safe-area-inset-bottom,0px); }
*{box-sizing:border-box} html{background:#090d17;scroll-behavior:smooth} body{margin:0;min-height:100dvh;font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--ink);font-size:15px}button,a,select{font:inherit}button{cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--gold-light);outline-offset:4px}button:disabled{cursor:not-allowed;opacity:.43}#app{min-height:100dvh}
.shell{isolation:isolate;min-height:100dvh;position:relative;overflow:hidden;background:#0b0e19;}
.ambient{position:fixed;inset:-28px;z-index:-3;background-position:center;background-size:cover;transform:scale(1.03);will-change:transform;opacity:.95}
.ambient:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,10,19,.14) 0%,rgba(11,14,25,.15) 29%,rgba(8,10,22,.38) 57%,rgba(5,8,15,.88) 100%),linear-gradient(90deg,rgba(5,6,12,.16),transparent 40%,rgba(5,6,12,.13));}
.ambient.entrance{background-image:url('assets/entrance-ambient.webp')}.ambient.fantasy{background-image:url('assets/fantasy-ambient.webp')}.ambient.mystery{background-image:url('assets/mystery-ambient.webp')}.ambient.scifi{background-image:url('assets/scifi-ambient.webp')}.ambient.history{background-image:url('assets/library-atmosphere.webp');filter:sepia(.36) saturate(.9)}.ambient.kids{background-image:url('assets/fantasy-ambient.webp');filter:hue-rotate(20deg) saturate(1.12)}.ambient.shop{background-image:url('assets/entrance-ambient.webp');filter:sepia(.25)}
.frame{position:relative;z-index:0;min-height:100dvh;max-width:1200px;margin:0 auto;padding:calc(18px + var(--safe-top)) clamp(14px,3vw,28px) calc(20px + var(--safe-bottom));display:flex;flex-direction:column;align-items:center}
.topbar{height:52px;width:100%;position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;z-index:4}.toplink{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:46px;height:46px;border:1px solid rgba(247,211,148,.78);background:rgba(9,13,23,.78);border-radius:999px;color:#fff2d7;backdrop-filter:blur(9px);text-decoration:none;padding:0 12px;box-shadow:0 4px 30px rgba(0,0,0,.2)}.toplink:hover{background:rgba(45,35,28,.86)}.toplink svg{height:23px;width:23px;stroke:currentColor;stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round}.topbar-label{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#eee0c9;text-shadow:0 2px 12px #080b12}
.brand{text-align:center;margin:clamp(1px,2.8dvh,38px) 0 0;position:relative;z-index:2;user-select:none}.brand-title{margin:0;font-family:Georgia,'Times New Roman',serif;font-weight:700;font-size:clamp(60px,15vw,112px);letter-spacing:-.065em;line-height:.99;background:linear-gradient(170deg,#fff5cc 4%,#eec47f 24%,#b97533 43%,#ffe4a0 53%,#b36e2e 78%,#ffdc8f 96%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 6px 26px rgba(0,0,0,.3);filter:drop-shadow(0 2px 1px rgba(92,50,16,.7))}.brand-title:after{content:'✧';font-size:.29em;vertical-align:top;display:inline-block;color:#fff6c4;filter:drop-shadow(0 0 8px #ffc961);margin-left:-.1em}.brand-sub{display:block;margin-top:2px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(13px,2.4vw,25px);font-weight:600;letter-spacing:.43em;color:#f7eddb;padding-left:.45em;text-shadow:0 2px 12px #000}.brand-tagline{margin:12px 0 0;color:#e8dfd0;text-shadow:0 2px 8px #000;font-family:Georgia,serif;font-size:clamp(15px,2.2vw,22px)}
.page-intro{text-align:center;width:min(95%,700px);margin:20px auto 14px;z-index:1}.page-intro h2{display:inline-block;font-family:Georgia,serif;letter-spacing:.09em;font-size:clamp(25px,6vw,43px);font-weight:500;text-transform:uppercase;color:#ffe5ac;margin:0;padding:7px 26px;border-top:1px solid rgba(237,195,111,.55);border-bottom:1px solid rgba(237,195,111,.55);text-shadow:0 2px 10px #000}.page-intro p{font-family:Georgia,serif;font-size:clamp(14px,3.5vw,19px);line-height:1.35;max-width:540px;margin:10px auto 0;text-shadow:0 3px 9px #000}
.carousel{position:relative;width:100%;max-width:1100px;height:clamp(405px,55dvh,650px);margin:clamp(19px,3dvh,36px) auto 0;flex-shrink:0;touch-action:pan-y;outline:none}.carousel.genre-view{height:clamp(405px,53dvh,620px);margin-top:12px}.carousel-card{position:absolute;left:50%;top:0;width:clamp(230px,71vw,420px);height:100%;border-radius:clamp(20px,4vw,31px);overflow:hidden;border:1.4px solid rgba(255,213,141,.82);background:#09111e;box-shadow:0 0 0 1px rgba(255,225,166,.23),0 0 30px rgba(235,158,62,.26),0 21px 65px #01040bbb;transition:transform .44s cubic-bezier(.2,.7,.2,1),opacity .44s ease,filter .44s ease,box-shadow .2s ease;transform:translateX(-50%) translateX(calc(var(--offset) * min(60vw, 360px))) scale(var(--scale));opacity:var(--opacity);filter:saturate(var(--saturate));z-index:var(--z);text-align:left;color:var(--ink);padding:0;appearance:none}.carousel-card[aria-hidden=true]{pointer-events:none}.carousel-card.current{box-shadow:0 0 0 2px rgba(255,216,154,.85),0 0 34px rgba(243,188,106,.55),0 24px 85px #01030bbb}.carousel-card:hover.current{box-shadow:0 0 0 2px rgba(255,239,189,.9),0 0 50px rgba(255,202,110,.75),0 24px 85px #01030bbb}.card-art{position:absolute;inset:0;background-size:cover;background-position:center 39%;transform:scale(1.02)}.card-shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 15%,rgba(1,7,15,.04) 40%,rgba(2,6,16,.6) 69%,rgba(2,5,13,.96) 100%)}.card-content{position:absolute;left:0;right:0;bottom:0;padding:25px clamp(14px,4vw,25px) clamp(24px,4.2vw,30px);text-align:center;text-shadow:0 2px 6px #05070d}.card-content h3{font-family:Georgia,'Times New Roman',serif;font-weight:500;text-transform:uppercase;letter-spacing:.005em;line-height:1.03;font-size:clamp(27px,7.5vw,48px);margin:0 0 11px;color:#ffe6af}.card-content p{font-family:Georgia,serif;font-size:clamp(13px,3.8vw,19px);line-height:1.36;margin:0 auto;max-width:355px;color:#fff8e9}.card-content .mini-meta{margin-top:13px;display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;font-size:12px;color:#ffe1a3;letter-spacing:.02em}.card-content .mini-meta span{white-space:nowrap}.genre-view .card-content{text-align:left}.genre-view .card-content h3{text-transform:none;font-size:clamp(26px,7vw,44px)}.genre-view .card-content p{font-family:Georgia,serif;font-size:clamp(13px,3.5vw,17px);line-height:1.45}.genre-view .card-content .mini-meta{justify-content:flex-start}
.card-demo{position:absolute;top:13px;left:13px;z-index:1;padding:5px 9px;font-size:10px;letter-spacing:.1em;color:#fff2d4;background:rgba(8,11,18,.79);border:1px solid rgba(249,218,156,.35);border-radius:999px;text-transform:uppercase}
.card-side-heading{position:absolute;top:19px;left:10px;right:10px;text-align:center;font-size:11px;letter-spacing:.1em;text-shadow:0 2px 4px #000;color:#ffdf9a}
.carousel-actions{display:flex;align-items:center;justify-content:center;gap:15px;margin-top:21px;position:relative;z-index:5;min-height:42px}.nav-arrow{display:inline-flex;justify-content:center;align-items:center;width:43px;height:43px;border:1px solid rgba(255,218,155,.7);border-radius:50%;background:rgba(5,7,13,.75);color:var(--gold-light);box-shadow:0 0 12px rgba(0,0,0,.4)}.nav-arrow:hover{background:rgba(43,36,29,.92)}.nav-arrow svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}.dots{display:flex;align-items:center;justify-content:center;gap:9px}.dot{border:0;padding:0;border-radius:50%;height:8px;width:8px;background:rgba(244,229,209,.36);box-shadow:0 1px 6px #000}.dot.active{height:13px;width:13px;background:radial-gradient(circle at 36% 30%,#fff0bb,#f6c366 65%,#b57b31);box-shadow:0 0 13px #ffd48f80}.dot:focus-visible{outline-offset:4px}
.home-bottom{margin:auto auto 1.8dvh;font-size:11px;letter-spacing:.08em;color:#e5d4b8ad;text-align:center;padding-top:12px}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.book-head{margin:6px auto 10px;text-align:center;max-width:650px}.book-head h1{font-family:Georgia,serif;font-size:clamp(28px,8vw,48px);margin:6px 0;color:var(--gold-light);line-height:1.1}.book-head .eyebrow{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#eacb94}.book-head p{font-family:Georgia,serif;font-size:clamp(15px,4vw,19px);line-height:1.45;color:#fff0d7}.detail{width:min(100%,950px);display:grid;grid-template-columns: minmax(0,1fr);gap:17px;margin:18px auto 35px;padding:0 9px}.detail-cover{width:min(73vw,325px);height:auto;aspect-ratio:3/4.5;object-fit:cover;border-radius:17px;box-shadow:0 0 0 2px #e4bf7c,0 14px 45px #000a;margin:0 auto}.detail-info{background:rgba(5,8,18,.75);border:1px solid rgba(250,218,155,.32);border-radius:18px;padding:20px;backdrop-filter:blur(15px)}.eyebrow{letter-spacing:.16em;text-transform:uppercase;color:#edca90;font-size:12px}.detail-info h1{font-family:Georgia,serif;color:#ffe3ac;font-size:clamp(29px,5vw,45px);font-weight:500;margin:10px 0 3px}.detail-info .subtitle{color:#edc891;margin:2px 0 14px;font-family:Georgia,serif}.detail-info p{font-family:Georgia,serif;font-size:17px;line-height:1.58;color:#f6ecdc}.chips{display:flex;gap:7px;flex-wrap:wrap;margin:15px 0}.chip{border:1px solid #e8c89077;border-radius:999px;padding:6px 10px;font-size:12px;color:#f5debd;background:rgba(255,222,163,.08)}.cta-row{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 10px}.cta{border-radius:999px;border:1px solid var(--gold);padding:12px 18px;color:#0f0b09;background:linear-gradient(180deg,#f9de9e,#c8944e);font-weight:650;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;text-decoration:none}.cta.secondary{background:rgba(8,12,22,.82);color:#ffe4ad}.cta.quiet{color:#ead6b4;background:transparent;border-color:#c69a6580}.cta:hover:not(:disabled){filter:brightness(1.1)}.cta.full{width:100%}.notice{background:rgba(7,9,17,.78);border:1px solid #ffcf7959;border-radius:13px;padding:13px 14px;font-size:13px;line-height:1.5;color:#e7d5bd;margin:15px 0}.saved{color:#ffd782}.empty{background:rgba(7,11,19,.83);border:1px solid rgba(255,213,140,.33);border-radius:20px;padding:22px;max-width:610px;margin:26px auto;color:#f7ead2;text-align:center}.empty p{line-height:1.65}.shelf-title{font-family:Georgia,serif;color:#ffe5b1;font-size:clamp(30px,7vw,43px);margin:20px 0 10px}.shelf{width:100%;max-width:1000px;display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:15px;margin:15px 0 30px}.shelf-item{text-align:left;background:rgba(7,11,23,.80);border:1px solid #d6aa674f;border-radius:16px;overflow:hidden;padding:0;color:#fff6e8}.shelf-item img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover}.shelf-item span{display:block;padding:10px 12px;font-size:13px}.shelf-item small{display:block;color:#d6bc91;font-size:11px;margin-top:4px}.menu-scrim{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.65);backdrop-filter:blur(7px)}.menu-panel{position:fixed;z-index:51;left:0;top:0;bottom:0;width:min(360px,89vw);background:linear-gradient(160deg,#1e2230,#080b13 75%);border-right:1px solid #cda66e6c;padding:calc(28px + var(--safe-top)) 22px calc(20px + var(--safe-bottom));box-shadow:18px 0 70px #0008;overflow:auto}.menu-top{display:flex;justify-content:space-between;align-items:center}.menu-title{font-family:Georgia,serif;color:#fce0aa;font-size:30px}.menu-close{border:1px solid #e2bb8088;background:#161b2b;color:#f6e2c1;border-radius:50%;width:42px;height:42px;font-size:25px}.menu-nav{display:flex;flex-direction:column;margin-top:26px;gap:8px}.menu-nav a,.menu-nav button{display:flex;gap:12px;text-align:left;align-items:center;border:1px solid #cda66e42;padding:15px 12px;background:#171b28a8;text-decoration:none;color:#f9e9cb;border-radius:11px;min-height:48px}.menu-nav a:hover,.menu-nav button:hover{background:#282e3a}.menu-section{font-size:11px;letter-spacing:.17em;color:#c7a672;text-transform:uppercase;margin-top:22px}.menu-note{font-size:12px;color:#cfc0a7;line-height:1.6}.formrow{margin-top:14px}.formrow select{width:100%;padding:12px;background:#181f2c;color:#f6e1bf;border:1px solid #c3a36d;border-radius:10px}.upload-input{width:100%;margin:10px 0;font-size:12px}.reader{width:min(100%,750px);margin:20px auto;background:rgba(8,12,20,.86);padding:24px clamp(18px,4vw,47px);border:1px solid #ebbd7d44;border-radius:22px;line-height:1.8}.reader p{font-family:Georgia,serif;font-size:clamp(18px,3.7vw,21px);line-height:1.8}.audio-box{max-width:660px;margin:25px auto 0;padding:20px;border:1px solid #ebc68077;border-radius:17px;background:rgba(5,9,18,.84)}.audio-box audio{width:100%;margin-top:15px}.hidden{display:none!important}
@media(min-width:700px){.brand{margin-top:14px}.carousel{height:min(55dvh,650px);margin-top:38px}.carousel-card{width:clamp(310px,33vw,440px);transform:translateX(-50%) translateX(calc(var(--offset) * min(36vw, 430px))) scale(var(--scale))}.carousel.genre-view{height:min(59dvh,670px)}.detail{grid-template-columns:320px minmax(0,1fr);align-items:start;margin-top:36px}.detail-cover{width:100%}.frame{min-height:100dvh}.home-bottom{margin-top:17px}}
@media(max-height:690px){.brand{margin-top:0}.brand-title{font-size:clamp(48px,9vw,84px)}.brand-tagline{margin-top:4px}.page-intro{margin:8px auto 3px}.carousel{height:clamp(350px,56dvh,490px);margin-top:11px}.carousel.genre-view{height:clamp(340px,56dvh,490px)}.carousel-actions{margin-top:8px}.home-bottom{margin-top:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
/* The library entrance is intentionally a one-screen experience on common phones. */
@media(max-width:600px) and (min-height:700px){
  .carousel:not(.genre-view){height:52dvh;min-height:390px}
  .carousel.genre-view{height:50dvh;min-height:390px}
  .carousel-actions{margin-top:15px}
  .home-bottom{padding-top:7px;margin-bottom:0}
}

/* Phase 1 extensions preserve supplied imagery and carousel components. */
.reader p{font-size:var(--reader-size,20px)}.reader h1,.detail-info h1,.card-content h3{overflow-wrap:anywhere}.reading-tools{width:min(100%,750px);display:flex;gap:12px;flex-wrap:wrap;align-items:center;position:sticky;top:0;z-index:6;background:#0c1225ef;padding:12px;border-radius:12px}.reading-tools label{display:flex;gap:8px;align-items:center}select{max-width:100%;background:#151d2d;color:#fff0d4;padding:10px;border:1px solid #e1c48a;border-radius:8px}.reader [data-reading-anchor],.reader section{scroll-margin-top:110px}.audio-box{width:min(100%,660px)}.audio-box input[type=range]{width:100%}.player-controls,.episode-links{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}.audio-box details{border:1px solid #b69b66;padding:12px;border-radius:12px}.audio-box summary{cursor:pointer;padding:8px}.audio-file{display:block;margin:20px 0}.audio-file input{max-width:100%;margin-top:10px}dd{margin:5px 0 16px}dt{color:#eacb94;font-size:12px;text-transform:uppercase}button,a,input,select{touch-action:manipulation}.dot{min-width:24px;min-height:24px;border:8px solid transparent;background-clip:padding-box}.dot.active{min-width:28px;min-height:28px}.dots{gap:1px}.build-toast{position:fixed;bottom:20px;left:5%;width:90%;z-index:70;background:#1c2539;border:1px solid #f4d69d;padding:14px;border-radius:12px}.carousel-card{user-select:none}.shell:has(.menu-panel){height:100dvh;overflow:hidden}.menu-panel:focus{outline:none}@media(max-width:600px){.frame{padding-inline:12px}.carousel-card{width:72vw}.detail{padding:0}.detail-info{padding:18px}.page-intro h2{font-size:clamp(22px,6vw,33px);padding-inline:14px}.carousel.genre-view{height:clamp(340px,45dvh,440px);min-height:340px}.brand-title{font-size:clamp(55px,15vw,72px)}.carousel-actions{gap:8px}.home-bottom{font-size:10px}.card-content{padding-bottom:22px}.card-content h3{font-size:clamp(24px,7vw,34px)}}
@keyframes card-arrival{from{opacity:.65}to{opacity:1}}.carousel{animation:card-arrival .17s ease-out}

/* Refinement 02: same imagery, bounded page-turn motion, safe phone layout. */
html,body{overflow-x:clip}.carousel{perspective:1400px;animation:none;touch-action:pan-y pinch-zoom}.carousel-card{transform-origin:50% 50%;backface-visibility:hidden;will-change:transform,opacity;transition:none}.carousel-card:after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 9px 0 18px rgba(0,0,0,.08),inset -1px 0 1px rgba(255,240,205,.23)}.carousel.is-dragging{cursor:grabbing}.carousel-card.current:focus-visible{outline:3px solid #ffecc2;outline-offset:5px}.ambient.shop{background-image:url('assets/shop-atelier-r02.webp');filter:none}.shop-frame .brand-title{font-size:clamp(54px,15vw,90px)}.product-card{background:#1b1510}.product-card .card-content{text-align:left}.product-card .card-content h3{font-size:clamp(23px,6.5vw,36px);text-transform:none}.product-card .card-content p{font-size:clamp(13px,3.4vw,17px)}.panel-art{left:50%;right:auto;width:auto;height:100%;aspect-ratio:1/2;transform:translateX(-50%);background-repeat:no-repeat;background-size:300% 100%}.product-hero{width:min(76vw,300px);aspect-ratio:1/2;background-position:center;background-size:cover;background-repeat:no-repeat;border-radius:18px;border:1px solid #d2b27e;box-shadow:0 20px 55px #0008;margin:0 auto}.product-hero.scene-image{aspect-ratio:2/3}.image-caption{font-size:12px;color:#f0dfc5;line-height:1.5;text-align:center;max-width:340px;margin:12px auto}.image-choices{display:flex;justify-content:center;flex-wrap:wrap;gap:8px}.image-choices button[aria-pressed=true]{border-color:#fff1bb;background:#3c3020}.product-detail .detail-info h1{line-height:1.14}.market-note{font-size:14px!important}.card-content p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.carousel-actions{flex-shrink:0;max-width:100%;margin-bottom:0}.nav-arrow{width:44px;height:44px;flex-shrink:0}.dot{min-width:28px;min-height:28px;width:28px;height:28px;border:10px solid transparent;background-clip:padding-box;box-shadow:none;flex-shrink:0}.dot.active{min-width:28px;min-height:28px;width:28px;height:28px;border:8px solid transparent;background:#f7ce89;background-clip:padding-box;box-shadow:none}.dots{gap:2px}.topbar-label{font-size:10px;letter-spacing:.14em}.entrance-frame,.library-frame{height:100dvh;min-height:0;display:grid;grid-template-rows:46px auto minmax(160px,1fr) 48px;gap:12px;align-items:stretch;padding-top:calc(12px + var(--safe-top));padding-bottom:calc(34px + var(--safe-bottom))}.entrance-frame .topbar,.library-frame .topbar{height:46px}.entrance-frame .brand,.library-frame .brand{margin:0}.entrance-frame .carousel,.library-frame .carousel{height:100%;min-height:0;margin:0}.entrance-frame .carousel-actions,.library-frame .carousel-actions{margin:0;align-self:center}.library-frame{grid-template-rows:46px auto auto minmax(150px,1fr) 48px;gap:10px}.library-frame .page-intro{margin:0 auto}.library-frame .brand-title{font-size:clamp(48px,13vw,88px)}.library-frame .page-intro h2{font-size:clamp(22px,5vw,32px);padding:5px 14px}.library-frame .page-intro p{font-size:clamp(13px,3.1vw,16px);margin-top:6px}.frame:not(.entrance-frame):not(.library-frame){padding-bottom:calc(34px + var(--safe-bottom))}
@media(max-width:600px){.entrance-frame .brand-title{font-size:clamp(54px,15vw,72px)}.entrance-frame .brand-tagline{font-size:16px;margin-top:8px}.entrance-frame .brand-sub{font-size:14px}.carousel-card{width:72vw}.entrance-frame,.library-frame{gap:10px;padding-inline:12px}.library-frame .brand-sub{font-size:13px}.library-frame .card-content h3{font-size:clamp(22px,6.3vw,32px)}.library-frame .card-content{padding:16px}.carousel-actions{gap:8px}.product-detail{grid-template-columns:minmax(0,1fr)}}
@media(max-height:600px){.entrance-frame,.library-frame{gap:7px;padding-top:8px;padding-bottom:calc(26px + var(--safe-bottom))}.entrance-frame .brand-title,.library-frame .brand-title{font-size:46px}.entrance-frame .brand-tagline{font-size:14px;margin-top:5px}.brand-sub{font-size:12px}.library-frame .page-intro p{display:none}.library-frame .page-intro h2{font-size:22px}.card-content{padding:14px}.card-content h3{font-size:23px}.card-content p{font-size:13px;-webkit-line-clamp:2}}
@media(prefers-reduced-motion:reduce){.carousel-card{will-change:auto}.carousel-card:after{box-shadow:inset 0 0 0 1px #ffe0a21f}}

/* Swipe fix 01: reserve horizontal gestures; keep native vertical pan/pinch. */
.carousel,.carousel-card{touch-action:pan-y pinch-zoom}
.card-art,.card-shade,.card-content,.card-demo{pointer-events:none}

/* Visual Refinement 03: paint and product presentation only. Gesture JS stays exact. */
.brand-title{
  background:none;
  color:#f5d68c;
  -webkit-text-fill-color:#f5d68c;
  filter:none;
  text-shadow:0 1px 0 #fff0bd,0 3px 12px rgba(49,27,10,.5);
}
.brand-title:after{color:#fff0bd;-webkit-text-fill-color:#fff0bd;filter:none;text-shadow:0 0 9px rgba(255,220,141,.55)}
.brand-sub{color:#fff1cf;text-shadow:0 2px 8px rgba(8,16,29,.65)}
.brand-tagline{color:#fff5e1;text-shadow:0 2px 8px rgba(8,16,29,.8)}
.ambient{opacity:1;filter:brightness(1.85)}
.ambient.fantasy{filter:brightness(1.8)}
.ambient.mystery{filter:brightness(1.8)}
.ambient.scifi{filter:brightness(1.8)}
.ambient.history{filter:brightness(1.5)}
.ambient.shop{filter:none}
.ambient:after{background:linear-gradient(180deg,rgba(8,17,31,.025),rgba(8,17,31,.06) 62%,rgba(8,17,31,.32)),linear-gradient(90deg,rgba(8,17,31,.05),transparent 40%,rgba(8,17,31,.05))}
.carousel-card{filter:none}
.card-shade{display:none}
.card-content{background:linear-gradient(180deg,transparent,rgba(6,16,29,.76) 28%,rgba(6,16,29,.94));text-shadow:0 1px 4px rgba(0,0,0,.6)}
.page-intro h2{color:#ffe5ab;text-shadow:0 2px 7px rgba(6,15,28,.85)}
.page-intro p{color:#fff5e1;text-shadow:0 2px 6px rgba(6,15,28,.95)}

/* A clear image area above a compact information panel, within the same card. */
.product-card{display:grid;grid-template-rows:minmax(0,1fr) auto;background:#172f3c}
.product-card .card-art{position:relative;grid-row:1;inset:auto;left:auto;right:auto;width:100%;height:100%;transform:none;background-size:contain;background-repeat:no-repeat;background-position:center}
.product-card .panel-art{justify-self:center;align-self:center;width:auto;max-width:100%;height:100%;aspect-ratio:3/5;background-size:300% auto!important}
.product-card .panel-art[style*="background-position:0%"]{aspect-ratio:1/1}
.product-card .panel-art[style*="background-position:50%"]{aspect-ratio:3/4}
.product-card .card-content{position:relative;grid-row:2;inset:auto;left:auto;right:auto;bottom:auto;padding:12px 16px;background:linear-gradient(145deg,#f7edda,#e9dcc2);border-top:1px solid #d5b477;color:#203344;text-align:left;text-shadow:none}
.product-card .card-content h3{color:#203344;font-size:clamp(19px,5.2vw,26px);line-height:1.12;margin:0 0 6px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.product-card .card-content p{color:#344b5c;font-size:clamp(13px,3.35vw,15px);line-height:1.4;-webkit-line-clamp:2;text-shadow:none}
.product-card .mini-meta{display:none}
.product-card .card-demo{background:rgba(9,24,35,.9);color:#fff0cb;border-color:#dfbd7d}
.product-hero{width:min(86vw,340px,100%);filter:none}
@media(max-width:600px){.shop-frame .page-intro p{display:none}.product-card .card-content{padding:12px 14px}}

/* Visual Restoration 04. Source pixels are restored, never reconstructed.
   Pointer/Touch reservations, card transforms and snap timing above stay exact. */
.ambient{inset:0;transform:none;will-change:auto;opacity:1;filter:none!important;background-position:center;background-size:cover}
.ambient.entrance{background-image:url('assets/fantasy-world-r04.webp');background-position:center}
.ambient.fantasy,.ambient.kids{background-image:url('assets/fantasy-world-r04.webp');background-position:right center}
.ambient.mystery{background-image:url('assets/mystery-scene-r04.webp');background-position:center}
.ambient.scifi{background-image:url('assets/scifi-scene-r04.webp');background-position:center}
.ambient.history,.ambient.shop{background-image:url('assets/shop-atelier-r04.webp')}
.ambient:after{background:linear-gradient(180deg,transparent 72%,rgba(7,16,28,.18))}
.ambient.entrance:before,.ambient.fantasy:before{content:none}
.original-wordmark{display:block;width:100%;height:auto;object-fit:contain;filter:none;clip-path:none;-webkit-mask-image:url('assets/wordmark-mask-r04.svg');mask-image:url('assets/wordmark-mask-r04.svg');-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;mask-composite:add;-webkit-mask-composite:source-over}
.brand{width:min(78vw,430px);justify-self:center;margin:0 auto}
.brand-tagline{margin:5px 0 0;font-size:clamp(14px,3.8vw,20px);text-shadow:0 1px 5px #17294a,0 1px 3px #17294a}
.entrance-frame,.library-frame{height:auto;min-height:100dvh;grid-template-rows:auto minmax(440px,1fr) 48px;gap:14px;padding-top:calc(18px + var(--safe-top));padding-bottom:calc(34px + var(--safe-bottom))}
.library-frame{grid-template-rows:auto auto minmax(440px,1fr) 48px;gap:12px}
.entrance-frame .topbar,.library-frame .topbar{position:absolute;top:calc(12px + var(--safe-top));left:12px;right:12px;width:auto;height:46px}
.entrance-frame .topbar-label,.library-frame .topbar-label{position:absolute;right:3px;top:3px;background:#10233dde;border:1px solid #e6c48b65;border-radius:8px;padding:4px 6px;font-size:8px;letter-spacing:.06em}
.library-frame .brand{width:min(70vw,300px)}
.library-frame .page-intro{margin:0 auto;padding:5px 12px;width:auto;max-width:90%;border-radius:12px;background:#11273ddb;border:1px solid #dfc29170}
.library-frame .page-intro h2{border:0;padding:0;font-size:clamp(22px,5.2vw,30px);color:#ffe4a1}
.library-frame .page-intro p{margin:4px 0 0;font-size:13px}
.entrance-frame .carousel,.library-frame .carousel{height:clamp(440px,58dvh,600px);min-height:440px;width:calc(100% + 24px);margin-left:-12px}
.entrance-frame .carousel-card,.library-frame .carousel-card{width:min(74vw,350px);border-radius:23px;border:1.5px solid #f9d290;background:#0c2036}
.card-art{transform:none;background-position:center 38%;filter:none}
.card-shade{display:none}
.card-content{padding:14px 16px 18px;background:linear-gradient(180deg,transparent,#0b1b31dd 18%,#08192cf5);text-shadow:0 1px 4px #050b16}
.card-content h3{font-size:clamp(24px,6.5vw,35px);line-height:1.06;margin:0 0 7px}
.card-content p{font-size:clamp(13px,3.5vw,16px);line-height:1.38;-webkit-line-clamp:2}
.book-card .card-art{background-size:contain;background-position:center}
.book-card.original-cover .card-content{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.book-card.original-cover .card-demo{top:8px;left:8px;padding:4px 7px;font-size:8px;background:#102339e8}
.product-card{grid-template-rows:minmax(0,1fr) auto;background:#172839}
.product-card .card-art{background-size:contain;background-position:center;transform:none;width:100%;height:100%;max-width:100%;aspect-ratio:auto}
.product-card .card-content{background:linear-gradient(145deg,#fff4df,#eddfc3);padding:12px 14px;border-top:1px solid #d6b776;position:relative;min-height:90px;text-shadow:none}
.product-card .card-content h3{font-size:clamp(19px,5vw,24px);color:#21384a;margin:0 0 6px;text-transform:none;line-height:1.14}
.product-card .card-content p{font-size:13px;color:#34485a;line-height:1.38;-webkit-line-clamp:2}
.product-card .card-demo{font-size:9px;left:10px;top:10px}
.product-hero{width:min(86vw,380px,100%);aspect-ratio:3/4;background-size:contain;background-color:#142435;filter:none}
.product-hero.scene-image{aspect-ratio:2/3;background-size:contain}
.detail-cover{width:min(80vw,380px);aspect-ratio:auto;height:auto;object-fit:contain}
.detail-info{backdrop-filter:none;background:#102237ed}
.carousel-actions{align-self:center;gap:12px}
@media(min-width:700px){
 .entrance-frame,.library-frame{height:100dvh;min-height:720px;padding-top:12px;grid-template-rows:auto minmax(420px,1fr) 48px;gap:10px}
 .library-frame{grid-template-rows:auto auto minmax(420px,1fr) 48px}
 .brand{width:360px}.library-frame .brand{width:290px}
 .entrance-frame .carousel,.library-frame .carousel{height:100%;min-height:420px;width:100%;margin-left:0}
 .entrance-frame .carousel-card,.library-frame .carousel-card{width:min(32vw,330px)}
 .entrance-frame .topbar,.library-frame .topbar{left:28px;right:28px}
 .detail-cover{width:100%}
}
@media(max-width:600px){
 .ambient.entrance,.ambient.fantasy,.ambient.kids{background-image:url('assets/fantasy-world-portrait-r04.webp');background-position:center}
 .entrance-frame .brand-tagline{font-size:14px;margin-top:4px}
 .shop-frame .page-intro p{display:none}
 .carousel-actions{gap:8px}
 .library-frame .card-content{padding:14px}
 .library-frame .product-card .card-content{padding:12px 14px}
}
@media(max-height:700px) and (max-width:699px){
 /* Keep the large illustrations; short screens may scroll to the controls. */
 .entrance-frame,.library-frame{height:auto;min-height:100dvh;padding-bottom:calc(34px + var(--safe-bottom))}
}

/* Visual Master 05: crossfade is isolated from the locked card gesture engine. */
.ambient.visual-stage{background-image:none!important;pointer-events:none;overflow:hidden}
.ambient-layer{position:absolute;inset:0;display:block;background-size:cover;background-position:center;opacity:1;transition:opacity 220ms ease;filter:none;transform:none;pointer-events:none}
.ambient.visual-stage:after{z-index:3;background:linear-gradient(180deg,transparent 78%,rgba(7,16,28,.12))}
.cover-study-frame .page-intro p{display:block}
.draft-study .card-art{background-size:cover;background-position:center}
.draft-study .card-content{padding:36px 18px 22px;background:linear-gradient(180deg,transparent,rgba(6,19,31,.93) 45%);text-align:center}
.draft-study .card-content h3{font-family:Georgia,'Times New Roman',serif;text-transform:uppercase;font-weight:500;font-size:clamp(25px,7vw,34px);letter-spacing:.02em;color:#ffe9b5;line-height:1.09;text-wrap:balance}
.draft-study .card-content p{font-size:12px;color:#f4e6cc}
.draft-study .card-demo{font-size:9px;background:#132337f0}
.cover-proof{position:relative;width:min(80vw,380px);aspect-ratio:2/3;overflow:hidden;border:1px solid #e2bf7b;border-radius:4px;align-self:start}
.cover-proof img{width:100%;height:100%;object-fit:cover;display:block}
.cover-typeset{position:absolute;left:0;right:0;bottom:0;padding:44px 20px 24px;background:linear-gradient(180deg,transparent,#071c2dec 40%);text-align:center;color:#ffe4a2}
.cover-typeset>span,.cover-typeset>small{font-size:9px;letter-spacing:.13em;color:#fff1d2}
.cover-typeset h2{font-family:Georgia,'Times New Roman',serif;text-transform:uppercase;font-size:clamp(28px,8vw,38px);font-weight:500;letter-spacing:.025em;line-height:1.08;text-wrap:balance;margin:9px 0 12px}
.cover-proof-status{position:absolute;left:10px;top:10px;padding:6px 8px;font:600 9px/1.2 system-ui;background:#10283bef;color:#fff0c5;border:1px solid #e2bf7b;border-radius:5px}
@media(min-width:700px){.cover-proof{width:100%}}
@media(prefers-reduced-motion:reduce){.ambient-layer{transition:none}}


/* 2026-10-14: mobile-only clean carousel.
   No dots, arrows or visible swipe coaching on phones.
   The drag/finger gesture engine, cards, images and desktop layout are untouched.
   100dvh allows Chrome's toolbar to appear/disappear without cropping the header. */
@media (max-width: 699px) {
  .entrance-frame, .library-frame {
    height: 100dvh;
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr);
    gap: clamp(7px, 1.35dvh, 12px);
    padding-top: calc(10px + var(--safe-top));
    padding-bottom: calc(12px + var(--safe-bottom));
  }
  .library-frame {grid-template-rows: auto auto minmax(0, 1fr);}
  .entrance-frame .brand {width: min(76vw, 380px);}
  .library-frame .brand {width: min(66vw, 286px);}
  .entrance-frame .carousel, .library-frame .carousel {
    height: 100%; min-height: 0; margin: 0;
    align-self: stretch;
  }
  .entrance-frame .carousel-actions, .library-frame .carousel-actions {display: none !important;}
  .entrance-frame .brand-tagline {margin-top: 3px;}
  .library-frame .page-intro {padding: 4px 10px;}
}
@media (max-width: 699px) and (max-height: 600px) {
  .entrance-frame, .library-frame {gap: 6px; padding-top: calc(7px + var(--safe-top)); padding-bottom: calc(8px + var(--safe-bottom));}
  .entrance-frame .brand {width: min(65vw, 275px);}
  .library-frame .brand {width: min(55vw, 245px);}
}

/* v9 polish: visitor hurdle and app controls, existing card geometry untouched. */
[hidden]{display:none!important}
html.wz-locked #app{display:none}
#visitor-gate{min-height:100svh;display:grid;place-items:center;padding:24px 18px max(24px,env(safe-area-inset-bottom));background:radial-gradient(ellipse at 50% 20%,#352b25 0%,#121624 48%,#080b12 100%)}
.visitor-panel{width:min(100%,410px);padding:20px clamp(18px,5vw,32px) 28px;text-align:center;border:1px solid #9c7b454f;border-radius:24px;background:#10121cdd;box-shadow:0 24px 80px #0007}
.visitor-panel img{width:100%;height:auto;max-width:310px;display:block;margin:0 auto 4px}
.visitor-panel h1{font-size:clamp(21px,5.5vw,27px);font-weight:500;line-height:1.25;color:var(--gold-light);margin:0 0 14px}
.visitor-panel p{line-height:1.55;color:var(--muted)}
.visitor-panel label{display:block;text-align:left;margin:24px 0 8px}
.visitor-panel input{display:block;width:100%;min-height:56px;border-radius:12px;border:1px solid var(--gold-soft);background:#080d17;color:var(--gold-light);font:26px system-ui;text-align:center;letter-spacing:.4em;margin-bottom:18px}
.visitor-panel small{display:block;font-size:12px;line-height:1.5;color:var(--muted)}
#visitor-error{min-height:1.5em;color:#ffd7bd;font-size:14px;margin:12px 0}
.menu-panel{overflow-y:auto;overscroll-behavior:contain;max-height:100dvh}
.menu-panel .full{margin-top:12px;white-space:normal}
.detail-info .notice h2{font-size:20px;line-height:1.3;margin-top:0}
.detail-info .notice p{margin-bottom:0}
.app-dialog{width:min(90vw,430px);max-height:85dvh;overflow:auto;border:1px solid var(--gold-soft);border-radius:20px;background:#121624;color:var(--ink);padding:25px;line-height:1.6;box-shadow:0 20px 90px #000a}
.app-dialog::backdrop{background:#050710c9;backdrop-filter:blur(5px)}
.app-dialog h2{color:var(--gold-light);font-size:23px;margin-top:0}
.app-dialog .cta{margin-top:12px}
html,body{max-width:100%;overflow-x:clip}

/* Keep the added menu button clear of the small library label. */
.topbar.has-back .topbar-label{position:static;margin:auto;text-align:center;max-width:calc(100% - 120px)}

/* International pocket covers: same illustration for every locale, live text. */
.pocket-art-window{position:absolute;inset:0;display:block;overflow:hidden;pointer-events:none}
.pocket-illustration{position:absolute;left:0;right:0;bottom:0;display:block;background-size:cover;background-position:center bottom;background-repeat:no-repeat}
.book-card.pocket-layout{isolation:isolate;background:#091623}
.pocket-layout .pocket-art-window:after,.pocket-preview .pocket-art-window:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#040d1be8 0%,#061426b8 13%,transparent 38%,transparent 57%,#06142665 77%,#040d1bc9 100%);box-shadow:inset 8px 0 12px #0004,inset -1px 0 #ffe6aa55}
.pocket-title{position:absolute;top:0;left:0;right:0;display:block;text-align:center;padding:46px 18px 18px;color:#ffe3a2;pointer-events:none;text-shadow:0 2px 3px #000,0 4px 16px #000c;z-index:2}
.pocket-imprint{display:block;font-size:9px;letter-spacing:.19em;margin-bottom:9px;color:#ead2a1}
.pocket-title h3{font-family:Georgia,'Times New Roman',serif;font-weight:600;font-size:clamp(23px,5.9vw,32px);line-height:1.08;letter-spacing:.015em;text-transform:none;text-wrap:balance;overflow-wrap:normal;hyphens:none;margin:0}
.library-frame .pocket-layout .card-content{padding:20px 17px 18px;background:linear-gradient(180deg,transparent,#081624df 18%,#061220f5);text-align:center;z-index:2}
.library-frame .pocket-layout .card-content p{font-size:clamp(13px,3.3vw,15px);line-height:1.4;-webkit-line-clamp:2;text-wrap:pretty}
.library-frame .pocket-layout .card-content .mini-meta{justify-content:center;font-size:10px;gap:7px;margin-top:9px;letter-spacing:.03em}
.pocket-layout .card-demo{z-index:3;top:10px;left:10px;font-size:8px;padding:4px 7px}
.detail-cover.pocket-preview{position:relative;isolation:isolate;display:block;aspect-ratio:680/1060;overflow:hidden;background:#091623}
.pocket-preview .pocket-title{padding:28px 20px}
.pocket-preview .pocket-title h3{font-size:clamp(27px,7vw,38px)}
.shelf-item .shelf-art{position:relative;isolation:isolate;width:100%;aspect-ratio:680/1060;padding:0;overflow:hidden}
.shelf-item .shelf-art span{padding:0}
@media(max-height:650px){.pocket-title{padding-top:38px}.pocket-title h3{font-size:22px}.pocket-imprint{margin-bottom:5px}.library-frame .pocket-layout .card-content .mini-meta{margin-top:5px}}

/* Small mobile detail copy adjustment; cover and carousel geometry unchanged. */
.detail-info .production-status{font-family:inherit;font-size:13px;line-height:1.45;color:var(--muted);margin:12px 0;padding:8px 11px;border-left:2px solid var(--gold-soft);border-radius:0 7px 7px 0;background:#080f1a70}
@media(max-width:699px){
 .detail{gap:12px;margin-top:12px;margin-bottom:22px}
 .detail-info{padding:16px}
 .detail-info h1{font-size:clamp(25px,6.2vw,32px);line-height:1.14;margin:7px 0}
 .detail-info p{font-size:16px;line-height:1.48;margin:10px 0}
 .detail-info .production-status{font-size:13px;line-height:1.45;margin:11px 0;padding:8px 11px}
 .detail-info .cta-row{gap:8px;margin:14px 0 10px}
}

/* TÅG 47: scoped book artwork and reading view only. */
.pocket-art-window[data-book-cover="TAG47_001"]:after{background:none!important}
.reader .scene-break{text-align:center;letter-spacing:.3em;margin:1.5em 0}
.reader[data-position-key^="TAG47-SV-1.0"]{background:#0b1018f5;color:#fff0d4}
.shell:has(.reader[data-position-key^="TAG47-SV-1.0"]){overflow:visible}
.reader h2{line-height:1.35;overflow-wrap:anywhere}
.reading-tools select{min-width:0;flex:1 1 220px;width:100%}
@media(max-width:600px){.reading-tools{gap:8px;padding:10px}.reading-tools label{font-size:14px}.reader{padding-inline:18px}.reader section,.reader [data-reading-anchor]{scroll-margin-top:190px}}