/* Approved open-book tabletop: native controls occupy the parchment pages. */
.story-table,.story-lobby{font-family:'Dino WenKai','Dino Lora',serif;color:#493924;min-width:0;container-type:inline-size}
.story-table *,.story-lobby *{box-sizing:border-box}
.story-table button,.story-lobby button,.story-dialog button{font:600 16px/1.4 'Dino WenKai','Dino Lora',serif;min-height:44px;padding:9px 12px;border:1px solid #bea67a;border-radius:7px;background:#2f684d;color:#fffaf0;cursor:pointer;white-space:normal;overflow-wrap:anywhere}
.story-table button:disabled,.story-lobby button:disabled{opacity:.6;cursor:default}.story-table .secondary{background:#fffaf0;color:#5a4732}
.story-table button:focus-visible,.story-lobby button:focus-visible{outline:3px solid #bc8d32;outline-offset:2px}
html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot[data-mode="storytable:game"] .app-drawer-body{padding:8px!important}
.story-book{background:url('../assets/desktop-open-book.webp') center/100% 100% no-repeat;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7%;padding:5% 6% 5% 9%;min-height:600px;align-items:start;position:relative;isolation:isolate}
.story-page-main,.story-page-aside{min-width:0}
.story-page-main h2{font-size:25px;line-height:1.4;margin:0 0 12px}
.story-page-aside h3{font-size:22px;margin:10px 0 14px}
.story-player{display:flex;align-items:center;gap:9px;border:1px solid #ded0b3;border-radius:7px;padding:10px;margin:9px 0;background:#fffaf3a6;min-width:0}
.story-avatar{width:38px;height:38px;flex:none;border-radius:50%;background:url('/assets/ui/components-v13/neutral-avatar.svg') center/contain no-repeat #e5e3db}
.story-player>div{min-width:0;flex:1}.story-player strong{display:block;font-size:16px;line-height:1.4;overflow-wrap:anywhere}.story-player small{font-size:13px;line-height:1.4}.story-player>div>small{display:block;color:#6d7253;margin-top:4px}.story-player.is-me{border-color:#9eae85}
.story-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.story-actions>button{flex:1 1 90px}
.story-grid{display:grid;width:100%;aspect-ratio:1;border:3px solid #ad8750;box-shadow:0 0 0 3px #e7c99a;border-radius:3px;overflow:hidden;background:#f5e6c0}
.board-8{grid-template-columns:repeat(8,minmax(0,1fr))}.board-9{grid-template-columns:repeat(9,minmax(0,1fr))}.board-10{grid-template-columns:repeat(10,minmax(0,1fr))}
html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-square,html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-number{padding:0!important;border:0!important;border-radius:0!important;min-height:0!important;min-width:0!important;position:relative;display:flex;align-items:center;justify-content:center;box-shadow:none!important;font-size:clamp(14px,3cqi,24px)!important}
.story-square.light{background:#efddb7!important}.story-square.dark{background:#a8824f!important}
html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-square.light{background:#efddb7!important}html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-square.dark{background:#a8824f!important}
html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-table button:where(:not(.story-square):not(.story-number):not(.story-xiangqi-cell)),html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-lobby button{background:#2f684d!important;color:#fffaf0!important;font-size:16px!important}
html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-table button.secondary{background:#fffaf0!important;color:#5a4732!important}
.story-piece{display:block;width:100%;height:100%;background-image:url('../assets/pieces.webp');background-size:600% 500%;background-repeat:no-repeat;flex:none;pointer-events:none}
.story-square .story-piece{width:95%;height:95%}.story-square.selected,.story-number.selected{outline:3px solid #5b8c66;outline-offset:-3px;z-index:1}
.story-log{list-style-position:inside;padding:0;margin:0;min-height:130px;max-height:350px;overflow:auto}.story-log li{padding:8px;border-bottom:1px solid #e3d8be;font:15px/1.5 'Dino Lora','Dino WenKai',serif}
.story-status{padding:12px;background:#edf0df;color:#426b48;border-radius:7px;line-height:1.5;margin:14px 0}
.story-page-aside label{display:grid;gap:6px}.story-page-aside select,.story-lobby select,.story-lobby input{font:inherit;min-height:44px;padding:8px;max-width:100%;width:100%;border:1px solid #c5b493;border-radius:6px;background:#fffaf0;color:inherit}
.story-rps{display:flex;gap:6px;margin-top:8px}.story-rps button{flex:1}.story-page-aside p{font-size:14px!important;line-height:1.6!important;margin:10px 0!important}
.story-waiting{min-height:260px;display:grid;place-items:center;text-align:center;padding:15px}.story-waiting img{height:200px;max-width:90%;object-fit:contain}.story-waiting code{font-size:14px}
.story-loading{display:grid;justify-items:center;padding:24px;min-height:350px}.story-loading img{width:180px;max-height:300px;object-fit:contain}.story-loading p{font-size:18px}
.story-intro-animation{position:absolute;inset:0;z-index:5;display:grid;place-items:center;background:#f4ead4;pointer-events:none;animation:story-reveal .9s forwards}.story-table{position:relative}
.story-intro-animation img{width:min(65%,380px);max-height:85%;object-fit:contain;transform-origin:left center;animation:story-open .9s both}
@keyframes story-open{0%,15%{transform:perspective(1100px) rotateY(0);opacity:1}50%{transform:perspective(1100px) rotateY(-45deg);opacity:1}75%,100%{transform:perspective(1100px) rotateY(-105deg);opacity:0}}
@keyframes story-reveal{0%,40%{opacity:1}85%,100%{opacity:0}}
.story-intro-animation .story-turning-page{position:absolute;left:50%;top:50%;transform-origin:left center;animation:story-paper-turn .9s both;max-height:85%;height:85%;width:auto;max-width:75%}
@keyframes story-paper-turn{0%,25%{opacity:0;transform:translate(-50%,-50%) perspective(1100px) rotateY(88deg)}40%{opacity:1;transform:translate(-50%,-50%) perspective(1100px) rotateY(45deg)}65%{opacity:1;transform:translate(-50%,-50%) perspective(1100px) rotateY(0)}85%,100%{opacity:0;transform:translate(-50%,-50%) perspective(1100px) rotateY(0)}}
.story-snake-cell{position:relative;border:1px solid #ceb895;min-width:0;min-height:0;display:flex;flex-direction:column;align-items:center;background:#fbefd3;line-height:1.1}.story-snake-cell.sage{background:#b7c196}.story-snake-cell>span{font:clamp(10px,1.7cqi,16px)/1.2 'Dino Lora',serif;padding-top:2px}.story-snake-cell>small{font-size:clamp(7px,1cqi,10px);line-height:1.1}.story-snake-cell>div{position:absolute;inset:25% 0 0;display:flex}.story-snake-cell .story-piece{flex:1;min-width:0}.story-pawns{display:flex;align-items:center;flex-wrap:wrap;gap:3px;padding:8px 0}.story-pawns>.story-piece{width:30px;height:36px}.story-pawns small{font-size:13px;margin-right:8px}.story-dice{width:72px;height:72px;margin:14px auto 8px;display:grid;place-items:center}.story-dice .story-piece{width:72px;height:72px}.story-plane-choice{display:flex;flex-wrap:wrap;gap:6px}.story-plane-choice button{display:flex;align-items:center;gap:5px}.story-plane-choice .story-piece{width:28px;height:32px}
.story-ludo{display:grid;grid-template-columns:repeat(15,minmax(0,1fr));grid-template-rows:repeat(15,minmax(0,1fr));aspect-ratio:1;width:100%;border:3px solid #af8b58;background:#fff5dc;position:relative;gap:0}
.story-hangar{border:3px solid #fcf2d9;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));padding:12%;gap:3px;border-radius:12px;min-width:0;min-height:0;overflow:hidden}
.story-home-cell>.story-piece{position:absolute;inset:0}
html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-hangar button,html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-flight-cell button{min-height:0!important;min-width:0!important;padding:0!important;width:100%;height:100%;border-radius:50%!important;background:#fff5e8!important;border:1px solid #795b3b!important}
.story-flight-cell,.story-home-cell{border:1px solid #bbac8e;display:flex;align-items:center;justify-content:center;position:relative;min-width:0;min-height:0}.story-flight-cell .story-piece{width:100%;height:100%}.story-flight-cell button{position:absolute;inset:0}.color-0{background:#d97864}.color-1{background:#7da6bc}.color-2{background:#e9c46a}.color-3{background:#91b384}.story-finish{z-index:2;display:grid;place-items:center;background:#fff7db;border:2px solid #b8985b;font-size:15px}
.story-number{background:#fff8e5!important;color:#386857!important;border:1px solid #c7b89c!important;font-family:'Dino Lora',serif!important}.story-number.given{color:#40382a!important;font-weight:700}.story-number.right-heavy{border-right:2px solid #76674f!important}.story-number.bottom-heavy{border-bottom:2px solid #76674f!important}.story-number small{font-size:8px;line-height:1.2}.story-keypad{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:10px}
.story-xiangqi{position:relative;display:grid;grid-template-columns:repeat(9,minmax(0,1fr));grid-template-rows:repeat(10,minmax(0,1fr));aspect-ratio:9/10;background:#ead0a1;border:3px solid #a48148}.story-xiangqi-cell{min-height:0!important;min-width:0!important;background:transparent!important;border:1px solid #ae8d55!important;padding:2px!important;border-radius:0!important;position:relative}.story-xiangqi-piece{display:grid;place-items:center;width:100%;height:100%;max-width:52px;max-height:52px;aspect-ratio:1;border:2px solid #a88b55;border-radius:50%;background:#f9e5b8;color:#282520;font:700 clamp(12px,2.3cqi,25px)/1 'Dino WenKai',serif}.story-xiangqi-piece.r{color:#a0352b}.story-river{position:absolute;left:0;right:0;top:46%;height:8%;pointer-events:none;background:#ead0a1;text-align:center;font-size:clamp(12px,2.5cqi,24px)}
.story-catalog{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}.story-catalog article{padding:15px;border:1px solid #d4bd8e;border-radius:10px;background:#fff7e4;min-width:0}.story-cover{height:135px;background:url('../assets/closed-book.webp') center/contain no-repeat;display:grid;place-items:center}.story-cover .story-piece{width:70px;height:90px}.story-catalog h3{font-size:20px;margin:10px 0 6px}.story-catalog small{display:block;font-size:14px}.story-catalog button{width:100%;margin-top:12px}.story-options{margin:16px 0}.story-options summary{min-height:44px;padding:10px;cursor:pointer}.story-options label{display:block;margin:8px 0}.story-rooms article{display:flex;gap:12px;align-items:center;border-bottom:1px solid #e1d0ad;padding:12px 0}.story-rooms article>div{flex:1;min-width:0}.story-rooms article p{font-size:14px}.story-dialog{width:min(600px,calc(100vw - 24px));max-height:85dvh;overflow:auto;font-family:'Dino WenKai',serif;background:#fff7e6;border:2px solid #b49a68;border-radius:12px;color:#513e28;padding:20px}.story-dialog::backdrop{background:#20222599}.story-dialog p{line-height:1.8}.story-dialog fieldset{margin:10px 0;border:1px solid #ceb98e}.story-dialog label{display:block;padding:6px}.story-dialog select{min-height:44px;max-width:100%;font:inherit}
@container(max-width:760px){.story-book{display:block;background-image:url('../assets/mobile-page.webp');padding:8% 6% 9% 17%;min-height:650px}.story-page-main h2{font-size:21px;margin-bottom:8px}.story-player{padding:7px;gap:7px}.story-player strong{font-size:14px}.story-player small{font-size:12px}.story-avatar{width:32px;height:32px}.story-page-aside{margin-top:12px}.story-page-aside h3,.story-log{display:none}.story-player+.story-board-host{margin-top:10px}.story-grid{border-width:2px}.story-actions{gap:5px}.story-actions>button{flex-basis:75px;padding:8px 6px;font-size:14px}.story-status{margin:8px 0;padding:9px;font-size:14px}.story-rps button{padding:8px 4px;font-size:14px}.story-catalog{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.story-catalog article{padding:10px}.story-catalog h3{font-size:17px}.story-catalog small{font-size:12px}.story-cover{height:110px}.story-rooms article{flex-wrap:wrap}.story-rooms button{margin-left:auto}.story-finish{font-size:10px}.story-snake-cell>small{font-size:7px}.story-snake-cell>span{font-size:9px}.story-keypad{gap:4px}.story-keypad button{padding:8px 4px;font-size:14px}}
@container(max-width:350px){.story-book{padding-left:15%;padding-right:5%}.story-actions>button{flex-basis:85px}.story-catalog{grid-template-columns:1fr}.story-hangar{gap:1px}.story-player strong small{display:block}}
@media(prefers-reduced-motion:reduce){.story-intro-animation{display:none!important}}
/* Fidelity repair: the game uses the approved complete reading desk and book. */
body.storybook-open #mobileGameNav{display:none!important}
html body.bookclub-app.storybook-open #mobileGameNav#mobileGameNav#mobileGameNav{display:none!important}
html body.bookclub-app.storybook-open #appDrawerRoot#appDrawerRoot#appDrawerRoot .app-drawer-header{min-height:48px!important;padding:8px 16px!important}
html body.bookclub-app.storybook-open #appDrawerRoot#appDrawerRoot#appDrawerRoot #appDrawerTitle{font-size:23px!important;line-height:1.2!important}
html body.bookclub-app.storybook-open #appDrawerRoot#appDrawerRoot#appDrawerRoot .app-drawer-kicker{display:none!important}
.story-table{background:url('../assets/reading-desk.webp') center/cover no-repeat;padding:18px 12px 10px}
.storybook-open #appDrawerTitle:before{content:'';display:inline-block;width:30px;height:30px;vertical-align:middle;margin-right:7px;background:url('../assets/identity-icons.webp') 0 0/500% 100% no-repeat}
.story-snake-board{position:relative;width:min(100%,max(280px,calc(100dvh - 470px)));margin:auto}.story-snake-board>.board-10{width:100%}
.story-route-art{position:absolute;display:block;background:url('../assets/snake-ladder.webp') no-repeat;background-size:200% 100%;pointer-events:none;z-index:2;transform-origin:center;opacity:.94}
.story-route-art.is-ladder{background-position:100% 0}
.story-route-art.is-snake{background-image:url('../assets/snakes.webp');background-size:300% 100%;width:11%!important}.story-route-art.snake-color-0{background-position:0 0}.story-route-art.snake-color-1{background-position:50% 0}.story-route-art.snake-color-2{background-position:100% 0}
.story-snake-cell>span{z-index:3;align-self:flex-start;background:#fff3dba6;padding:1px 2px}.story-snake-cell>small{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.story-snake-cell>div{z-index:4}
.story-home-cell:empty:before,.story-flight-cell:empty:before{content:'';display:block;width:68%;height:68%;background:#fff5e3;border:1px solid #a1875f;border-radius:50%;pointer-events:none}
@media(max-width:760px){.story-table{padding:6px 2px}}
@media(max-width:760px){
html body.bookclub-app.storybook-open #appDrawerRoot#appDrawerRoot#appDrawerRoot .app-drawer-header{height:0!important;min-height:0!important;padding:0!important;border:0!important;position:relative;z-index:6;overflow:visible!important;background:none!important}
html body.bookclub-app.storybook-open #appDrawerRoot#appDrawerRoot#appDrawerRoot #appDrawerTitle{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)!important}
html body.bookclub-app.storybook-open #appDrawerRoot#appDrawerRoot#appDrawerRoot .app-drawer-close{position:absolute!important;right:22px!important;top:27px!important;width:44px!important;height:44px!important;min-height:44px!important;border:0!important;background:#fff8e4!important;box-shadow:none!important}
.story-mobile-brand{display:flex!important;padding-right:28px;gap:7px;margin-bottom:8px;padding-bottom:8px}.story-mobile-brand .story-identity{width:34px;height:34px}.story-mobile-brand strong{font-size:20px}.story-mobile-brand small{font-size:11px}
.story-page-aside>[data-story-action=draw]{display:none}
}
.story-book{padding:3.5% 5.5% 3.5% 9%;gap:6%;min-height:590px}
.story-identity{display:block;width:42px;height:42px;flex:none;background:url('../assets/identity-icons.webp') no-repeat;background-size:500% 100%}
.story-identity-0{background-position:0 0}.story-identity-1{background-position:25% 0}.story-identity-2{background-position:50% 0}.story-identity-3{background-position:75% 0}
.story-avatar{background-image:url('../assets/identity-icons.webp');background-size:500% 100%;background-position:100% 0;background-color:transparent;border:1px solid #cfbf9e}
.story-mobile-brand{display:none}
.story-game-heading{display:flex;align-items:center;gap:10px;margin-bottom:14px;min-width:0}
.story-game-heading>div{flex:1;min-width:0}.story-game-heading h2{font-size:23px;margin:0;line-height:1.4}.story-game-heading small{display:block;font-size:13px;color:#7a735e;line-height:1.5}
.story-turn-badge{padding:5px 7px;font-size:12px;line-height:1.4;background:#e8edd7;color:#43734f;border-radius:5px;white-space:nowrap}
.story-coordinate-board{display:grid;grid-template-columns:18px minmax(0,1fr);grid-template-rows:minmax(0,1fr) 20px;max-width:100%;width:min(100%,max(280px,calc(100dvh - 470px)));margin:auto}
.story-coordinate-board>.story-grid{grid-column:2;grid-row:1}
.story-ranks{grid-column:1;grid-row:1;display:grid;grid-template-rows:repeat(8,1fr);font:12px/1 'Dino Lora',serif;align-items:center;text-align:center}
.story-files{grid-column:2;grid-row:2;display:grid;grid-template-columns:repeat(8,1fr);font:12px/1 'Dino Lora',serif;align-items:center;text-align:center}
html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-square.light{background:#efddb7 url('../assets/wood-tiles.webp') 0 0/200% 100% no-repeat!important}
html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-square.dark{background:#a8824f url('../assets/wood-tiles.webp') 100% 0/200% 100% no-repeat!important}
.story-square .story-piece{width:100%;height:100%}
.story-grid.board-10,.story-ludo,.story-xiangqi,.story-grid.board-9{width:min(100%,max(280px,calc(100dvh - 470px)));margin:auto}
.story-grid.board-8{grid-template-rows:repeat(8,minmax(0,1fr))}
.story-ludo .story-flight-cell .story-piece{width:100%;height:100%;position:absolute;inset:0}
.story-ludo .story-hangar button,.story-ludo .story-flight-cell button{font-size:0!important;line-height:0!important;min-width:0!important}
html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-ludo button{min-height:0!important;padding:0!important;font-size:0!important;line-height:0!important;background:#fff7e6!important}
.story-ludo .story-flight-cell{overflow:hidden}
.story-game-nav{display:flex;gap:6px;margin:10px 18px 0;padding:7px;background:#fff7e4;border:1px solid #b99e6f;border-radius:10px}
.story-game-nav button{flex:1;min-width:0;display:flex;align-items:center;gap:7px;font-size:14px;padding:7px 5px}
.story-game-nav .story-identity{width:28px;height:28px}.story-game-nav button[aria-current=page]{outline:2px solid #71976b;outline-offset:-2px}
.story-mobile-roll{display:none}.story-desktop-roll{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0}
.story-desktop-roll>.story-dice{margin:0}.story-desktop-roll>[data-story-action=roll]{flex:1;min-height:48px}
.story-desktop-roll>.story-plane-choice,.story-mobile-roll>.story-plane-choice{flex-basis:100%;width:100%}
.story-back-link{margin-top:12px}
.story-exit-actions{margin-top:7px}.story-actions>button{display:flex;align-items:center;justify-content:center;gap:7px}
.story-control-icon{display:block;width:22px;height:22px;flex:none;background:url('../assets/controls.webp') no-repeat;background-size:400% 100%}
@container(max-width:760px){
.story-table{padding:6px 2px;background-position:center top}
.story-book{padding:8% 6% 8% 17%;min-height:600px;display:flex;flex-direction:column}
.story-mobile-brand{display:flex;align-items:center;gap:9px;border-bottom:1px solid #dfd0b2;padding-bottom:10px;margin-bottom:10px}.story-mobile-brand strong{display:block;font-size:21px;line-height:1.3}.story-mobile-brand small{font-size:12px}
.story-game-heading{gap:7px;margin-bottom:10px}.story-game-heading .story-identity{width:34px;height:34px}.story-game-heading h2{font-size:17px}.story-game-heading small{font-size:11px}.story-turn-badge{font-size:10px;padding:4px}
.story-coordinate-board,.story-grid.board-10,.story-ludo,.story-xiangqi,.story-grid.board-9{width:100%;min-width:0}
.story-ranks,.story-files{font-size:10px}.story-coordinate-board{grid-template-columns:13px minmax(0,1fr);grid-template-rows:minmax(0,1fr) 18px}
.story-page-main{width:100%}.story-page-aside{width:100%;margin-top:4px}.story-page-aside>.story-player{display:none}
.story-game-nav,.story-desktop-roll{display:none}
.story-mobile-roll{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:10px 0}
.story-mobile-roll>.story-dice{width:54px;height:54px;margin:0;order:2}.story-mobile-roll>.story-dice .story-piece{width:54px;height:54px}.story-mobile-roll>[data-story-action=roll]{flex:1;min-height:48px;order:1}.story-mobile-roll>.story-plane-choice{order:3}
.story-actions>button{flex-basis:90px;font-size:14px!important}.story-control-icon{width:19px;height:19px}.story-actions{margin-top:7px}.story-player{margin:8px 0;padding:7px}.story-player .story-avatar{width:38px;height:38px}
.story-page-aside>.story-status{font-size:12px;margin-top:2px;padding:6px}.story-page-aside>.story-back-link{display:none}
}

.story-player time{font:14px/1.4 Lora,serif;white-space:nowrap;color:#58452c}.story-mobile-brand{display:none}html body.bookclub-app.storybook-open #appDrawerRoot#appDrawerRoot#appDrawerRoot .app-drawer-header{background:#fff8e5 url(../assets/reading-desk.webp) center top/cover no-repeat!important}

/* 2026-10-15 selected preview correction: preserve server board and turn data. */
.story-checker{background-image:url('../assets/checkers.webp');background-size:400% 100%}
.story-square .story-checker{width:94%;height:94%}
.story-mobile-opponents,.story-mobile-roster{display:none}
.story-piece-count{display:flex;align-items:center;gap:8px;font-size:13px;border:1px solid #dfd0b2;border-radius:5px;padding:6px;margin:7px 0}
.story-piece-count .story-piece{width:24px;height:24px}
.story-player.is-turn{background:#e6efe2;border-color:#94b58b}
.story-player time{margin-left:auto}
.story-page-main h2{font-weight:700}
.story-game-nav{background:#fff7e4b8}
html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-game-nav button{background:#fff7e4!important;color:#493924!important;border-color:#d3bd91!important;min-height:62px!important}
.story-coordinate-board,.story-snake-board,.story-grid.board-10,.story-ludo{width:100%;max-width:470px}
.story-page-aside .story-desktop-roll{padding:12px;border:1px solid #dfd0b2;border-radius:8px;background:#fffaf34d}
.story-desktop-roll>[data-story-action=roll]{min-height:64px;font-size:23px!important}
.story-log{background:repeating-linear-gradient(transparent 0 35px,#d8c7a666 35px 36px);min-height:180px}
.story-route-art.is-snake{width:13%!important}
.story-hangar{border-radius:8px;border:3px double #967347;padding:10%;gap:7%;background-image:url('../assets/wood-tiles.webp');background-blend-mode:soft-light;background-size:200% 100%}
.story-ludo .story-hangar button{opacity:1!important}
.story-ludo .story-hangar button .story-piece{width:100%;height:100%}
.story-finish{font-size:12px;background:#f2ddb1}
@container(max-width:760px){
.story-book{padding:7% 5% 7% 14%;min-height:0}
.story-mobile-brand{display:flex!important}
.story-game-heading{margin-bottom:8px}
.story-mobile-opponents{display:block}
.story-mobile-roster{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border:1px solid #dfd0b2;border-radius:7px;margin-top:10px;overflow:hidden}
.story-mobile-roster .story-player{display:flex;flex-direction:column;gap:4px;padding:6px 2px;margin:0;border:0;border-right:1px solid #dfd0b2;border-radius:0;text-align:center;background:#fffaf34d}
.story-mobile-roster .story-player:last-child{border-right:0}
.story-mobile-roster .story-player.is-turn{background:#e6efe2}
.story-mobile-roster .story-player strong{font-size:11px;line-height:1.4}
.story-mobile-roster .story-player strong small{display:block;font-size:10px}
.story-mobile-roster .story-player>div>small{font-size:10px}
.story-mobile-roster time{display:none}
.story-mobile-roster .story-avatar{width:34px;height:34px}
.story-desktop-roster{display:none}
.story-mobile-roll{padding:8px;border:1px solid #dfd0b2;border-radius:7px;background:#fffaf34d}
.story-mobile-roll>.story-dice{order:0;width:62px;height:62px}
.story-mobile-roll>.story-dice .story-piece{width:62px;height:62px}
.story-mobile-roll>[data-story-action=roll]{font-size:21px!important;min-height:56px}
.story-actions{gap:5px}
.story-actions>button{flex-basis:0}
.story-page-aside .story-status{background:transparent;padding:4px;text-align:center}
.story-ludo,.story-grid.board-10,.story-coordinate-board,.story-snake-board{max-width:none;width:100%}
.story-hangar{padding:9%;gap:6%}
.story-log{display:none}
}

/* Same book spread fits with its navigation at 1440 x 900. */
@container(min-width:761px){
.story-book{min-height:560px;padding-top:3%;padding-bottom:3%}
.story-coordinate-board,.story-snake-board,.story-ludo{width:min(100%,max(280px,calc(100dvh - 510px)))}
.story-snake-board .board-10{width:100%;max-width:none}
.story-desktop-roster .story-player{padding:7px;margin:6px 0;min-height:52px}
.story-desktop-roster .story-player .story-avatar{width:36px;height:36px}
.story-log{min-height:100px;max-height:150px}
.story-page-aside h3{margin:8px 0;font-size:21px}
.story-page-aside .story-status{margin:8px 0;padding:7px}
.story-page-aside .story-back-link{margin-top:5px}
.story-game-nav{margin-top:4px}
}
.story-route-art.is-snake{background-size:620% 120%;background-position:10.1% 50%;width:12%!important}
.story-route-art.is-ladder{background-size:570% 160%;background-position:80% 50%;width:7%!important}
.story-snake-cell>span{background:transparent;color:#382d1d;font-weight:600}
.story-pawns{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;padding:7px 0}
.story-pawns .story-piece{width:25px;height:30px;margin:auto}
.story-pawns small{display:none}
@container(max-width:760px){
.story-book{background-size:128% 106%;background-position:100% 50%;padding:5% 3% 6% 4%}
.story-mobile-brand{background:url('../assets/reading-desk.webp') 50% 0/cover no-repeat;margin:-3% -1% 10px;padding:9px 8px 9px;border-radius:7px}
.story-mobile-brand .story-identity{width:43px;height:43px}
.story-mobile-brand strong{font-size:23px}
.story-game-heading .story-identity{width:42px;height:42px}
.story-game-heading h2{font-size:21px}
.story-mobile-roster .story-player>div>small{display:none}
.story-mobile-roster .story-player strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-height:32px}
.story-mobile-roster .story-player strong small{display:inline}
.story-mobile-roster .story-player{min-height:83px}
.story-mobile-roster .story-player.is-turn>div>small{display:block;color:#35764a}
.story-mobile-opponents .story-player,.story-page-main>.story-player{padding:5px 7px;margin:5px 0}
.story-mobile-opponents .story-player>div>small{display:none}
.story-mobile-opponents .story-player strong small{display:inline}
.story-game-nav{display:flex;margin:5px 0 0;padding:4px;gap:3px;flex-wrap:nowrap}
html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-game-nav button{flex-direction:column;gap:1px;font-size:10px!important;line-height:1.3!important;padding:3px 1px!important;min-height:54px!important;border-radius:4px!important}
.story-game-nav .story-identity{width:24px;height:24px}
.story-game-nav button span:last-child{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.story-piece-count{font-size:11px;gap:5px;padding:3px 5px}
.story-actions>button{font-size:13px!important;padding:7px 3px!important}
}

.story-finish{background-image:url('../assets/ludo-markers.png');background-size:550.83% 220.28%;background-position:2.53% 47.34%;border:0}
.story-flight-marker{position:absolute;inset:5%;background:url('../assets/ludo-markers.png') no-repeat;background-size:550.83% 220.28%;pointer-events:none}
.marker-0{background-position:26.5% 47.34%}.marker-1{background-position:49.91% 47.34%}.marker-2{background-position:73.44% 47.34%}.marker-3{background-position:96.73% 47.34%}
.story-ludo .story-flight-cell:has(.story-flight-marker):before{display:none}
.story-ludo .story-home-cell.color-0{background-color:#cb5143}.story-ludo .story-home-cell.color-1{background-color:#4993bd}.story-ludo .story-home-cell.color-2{background-color:#e8b840}.story-ludo .story-home-cell.color-3{background-color:#569a65}

@container(max-width:760px){
.story-game-nav{width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden}
html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-game-nav button{min-width:0!important;flex:1 0 32px!important}
.story-book{background-size:145% 112%;background-position:69% 50%}
.story-mobile-brand{background-position:50% 6%;background-size:250% auto}
.story-page-main,.story-page-aside{max-width:100%}
.story-mobile-brand strong{font-weight:700}
.story-mobile-brand .story-identity{background-size:500% 100%;width:43px;height:43px}
}

.story-player-planes{display:flex;gap:2px;margin-top:3px}
.story-player-planes .story-piece{width:24px;height:24px}
.story-opening-summary{border:1px solid #d8c39d;border-radius:7px;padding:10px;margin:10px 0}
.story-opening-summary legend{font-size:19px;font-weight:700}
.story-opening-summary label{display:inline-flex;align-items:center;gap:4px;margin-right:8px;font-size:13px;min-height:32px}
.story-opening-summary input{accent-color:#2f684d}
@container(min-width:761px){
.story-player-planes .story-piece{width:29px;height:29px}
.story-table[data-game=ludo] .story-desktop-roster time,.story-table[data-game=snakes] .story-desktop-roster time{display:none}
.story-table[data-game=ludo] .story-log{min-height:70px;max-height:90px}
.story-table[data-game=dum] .story-page-main>.story-piece-count{display:none}
}
@container(max-width:760px){
.story-player-planes{justify-content:center}
.story-player-planes .story-piece{width:16px;height:16px}
.story-mobile-roster .story-player strong{font-size:10px}
.story-opening-summary{padding:6px;margin:5px 0}
.story-opening-summary legend{font-size:16px}
.story-opening-summary label{font-size:11px;margin-right:5px}
}

@container(max-width:760px){.story-mobile-brand{margin-left:0;margin-right:0}}

.story-turn-tile{background-image:url('../assets/ludo-tiles.png');background-size:300% 300%}
.turn-tile-0{background-position:0 0}.turn-tile-1{background-position:50% 0}.turn-tile-2{background-position:100% 0}.turn-tile-3{background-position:0 50%}
.story-lane-direction{position:absolute;inset:0;background-image:url('../assets/ludo-tiles.png');background-size:300% 300%;transform:rotate(-90deg);pointer-events:none}
.lane-0{background-position:50% 50%}.lane-1{background-position:100% 50%}.lane-2{background-position:0 100%}.lane-3{background-position:50% 100%}
.story-home-cell:has(.story-lane-direction):before{display:none}

.story-unrolled-dice{display:block;width:100%;height:100%;object-fit:contain}.story-opening-summary label input{width:16px;height:16px;min-height:0}

.story-desktop-exit{display:none}
html body.bookclub-app #appDrawerRoot#appDrawerRoot#appDrawerRoot .story-game-heading h2{font-weight:700!important;color:#29261d!important}
html body.bookclub-app.storybook-open #appDrawerRoot#appDrawerRoot#appDrawerRoot .app-drawer-close{border:0!important;box-shadow:none!important;background:#fff8e4!important;border-radius:5px!important;color:#594530!important}
@container(min-width:761px){
.story-table[data-game=snakes] .story-exit-actions,.story-table[data-game=ludo] .story-exit-actions{display:none}
.story-desktop-exit{display:flex}
.story-desktop-roster .story-player{background:#fffaf34d}
.story-desktop-roster .story-player.is-turn{background:#e6efe2}
.story-table[data-game=snakes] .story-desktop-roster .story-player:not(.is-turn){display:none}
.story-table[data-game=ludo] .story-desktop-roll{margin:8px 0}
.story-table[data-game=ludo] .story-page-aside>.story-back-link,.story-table[data-game=snakes] .story-page-aside>.story-back-link{display:none}
}

.story-desktop-count{display:none}
.story-nav-text{display:block;text-align:center;min-width:0}
.story-nav-text strong{font-weight:700}.story-nav-text small{display:block;font-size:11px;line-height:1.5;margin-top:4px}
@container(min-width:761px){
.story-game-nav button{min-height:76px;gap:7px}
.story-game-nav .story-identity{width:46px;height:46px}
.story-desktop-count{display:flex;flex-wrap:wrap;float:right;width:33%;padding:10px;gap:7px;min-height:145px}
.story-desktop-count>span:not(.story-piece){font-size:13px}
.story-table[data-game=dum] .story-log{width:64%;min-height:165px;max-height:210px}
.story-table[data-game=dum] .story-status{clear:both}
}
@container(max-width:760px){.story-nav-text small{display:none}.story-nav-text strong{font-size:10px}}

.story-nav-art{background-image:url('../assets/nav-icons.png');background-size:400% 130%}

@container(min-width:761px){
.story-book{padding-top:2.5%;padding-bottom:2.5%;min-height:530px}
.story-table[data-game=dum] .story-coordinate-board{width:min(100%,max(280px,calc(100dvh - 490px)))}
.story-table[data-game=dum] .story-page-main>.story-actions{display:inline-flex;width:43%;vertical-align:top;margin-right:1%}
.story-table[data-game=dum] .story-page-main>.story-exit-actions{width:55%;margin-right:0}
.story-table[data-game=dum] .story-page-main>.story-actions>button{flex-basis:0;font-size:13px!important;padding:7px 3px!important}
.story-game-nav button{padding-top:5px;padding-bottom:5px}
}
@container(max-width:760px){.story-mobile-brand>div{background:#fff8e4e8;padding:3px 5px;border-radius:3px}}

.story-lane-direction{transform:none}
.story-hangar{margin:12%;padding:8%;border-radius:7px}
@container(min-width:761px){
.story-table[data-game=ludo] .story-desktop-roster .story-player{padding:6px 9px;margin:5px 0;min-height:54px}
.story-table[data-game=ludo] .story-desktop-roster .story-player>div>small{display:none}
.story-table[data-game=ludo] .story-desktop-roster strong{font-size:14px;line-height:1.35;margin:0!important;padding:0!important}
.story-table[data-game=ludo] .story-desktop-roster strong small{display:inline;font-size:12px}
.story-table[data-game=ludo] .story-player-planes{margin-top:2px;height:24px}
.story-table[data-game=ludo] .story-player-planes .story-piece{width:24px;height:24px}
.story-table[data-game=ludo] .story-log{min-height:65px;max-height:90px}
.story-table[data-game=ludo] .story-desktop-roll{padding:7px;margin:7px 0}
.story-table[data-game=ludo] .story-desktop-roll>.story-dice{width:58px;height:58px}
.story-table[data-game=ludo] .story-desktop-roll>.story-dice .story-piece{width:58px;height:58px}
.story-table[data-game=ludo] .story-desktop-roll>[data-story-action=roll]{min-height:55px}
}

@container(min-width:761px){
.story-table[data-game=snakes] .story-exit-actions,.story-table[data-game=ludo] .story-exit-actions{display:flex;position:absolute;left:54.5%;right:5.5%;bottom:3%;margin:0}
}

.story-ludo .story-flight-cell.story-cut-corner{background:transparent;border:0;overflow:visible}
.story-corner-art{position:absolute;inset:0;background-image:url('../assets/ludo-corners.png');background-size:400% 134%;background-position:0 50%;pointer-events:none}

@container(max-width:760px){
.story-table:is([data-game=dum],[data-game=snakes],[data-game=ludo]) .story-player .story-avatar{width:44px;height:44px}
.story-mobile-roster .story-player strong{font-size:13px;line-height:1.35;max-height:38px}
.story-mobile-roster .story-player strong small{font-size:11px}
.story-mobile-roster .story-player .story-avatar{width:44px;height:44px}
.story-mobile-roster .story-player-planes .story-piece{flex:1 1 0;min-width:0;max-width:18px;width:18px;height:18px}
.story-mobile-roster .story-player{min-height:98px}
.story-table:is([data-game=dum],[data-game=snakes],[data-game=ludo]) .story-actions>button{font-size:15px!important}
.story-turn-badge{font-size:11px}
}

@container(min-width:761px){
.story-table:is([data-game=snakes],[data-game=ludo]) .story-page-aside{padding-bottom:95px}
.story-table[data-game=snakes] .story-exit-actions,.story-table[data-game=ludo] .story-exit-actions{bottom:8%}
}
