/* Cloth boards, inset endpapers and stitched gutter; all artwork stays 2D. */
#book{--grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='128' height='128'%3E%3Cfilter id='paper'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23a48f63' opacity='.055' filter='url(%23paper)' d='M0 0h128v128H0z'/%3E%3C/svg%3E");width:min(1120px,calc(100vw - 48px));height:min(620px,calc(100dvh - 64px));max-width:none;max-height:none;padding:12px 12px 17px;border:1px solid #718465;border-radius:5px 11px 12px 5px;background:#81937b;overflow:visible;box-shadow:0 6px 0 #566c51,0 35px 70px #12251c80,inset 0 0 0 5px #9aa388,inset 0 0 0 6px #c5b88770;perspective:1800px}
#book:has(figure[hidden]){max-width:none}#book [hidden]{display:none!important}#book::backdrop{background:#172c26b8;backdrop-filter:blur(7px)}#book[open]{animation:hardcover-reveal .42s cubic-bezier(.2,.6,.2,1)}
#book:before{content:'';position:absolute;left:5px;right:5px;bottom:-4px;height:16px;z-index:-1;border-radius:2px 2px 9px 5px;background:repeating-linear-gradient(#d2c4a6 0 1px,#f4ecd6 1px 3px);box-shadow:0 4px 0 #677e5c}
#book .close-book{top:-19px;right:-16px;background:#fff8e7;width:38px;min-height:38px;z-index:12;border:1px solid #b9baa1;box-shadow:0 3px 7px #233a3430}#book .close-book svg{width:20px;height:20px}
#book .book-spread{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:minmax(0,1fr);height:100%;min-height:0;max-height:none;border-radius:3px 6px 6px 4px;overflow:hidden;background:#fcf4e3;filter:drop-shadow(0 2px 3px #29472a50)}
#book .book-spread:after{content:'';position:absolute;z-index:6;top:0;bottom:0;left:calc(50% - 12px);width:24px;background:linear-gradient(90deg,transparent,#8b755c20 25%,#69513e38 46%,#fff4d78c 51%,#a8946820 70%,transparent);pointer-events:none}
.story-left,.story-right{min-height:0;position:relative;display:flex;flex-direction:column;padding:28px 34px 20px;background-image:var(--grain)}.story-left{padding-right:38px;background-color:#f8f1df}.story-right{padding-left:38px;background-color:#fff8e9}
.story-imprint{font:500 10px/1.6 Oz Sans;color:#8c8b6d;text-align:center;letter-spacing:.13em;text-transform:uppercase;margin:0 0 18px}.story-left h3{font:700 20px/1.5 Oz Story;margin:0 0 15px;text-align:center;color:#718368}
#bookPlate{position:relative;min-height:0;flex:1;display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center}
#book #bookFigure{margin:0;padding:0;background:transparent;border-radius:3px;min-height:0;display:flex;align-items:center;flex:1;width:100%;overflow:hidden;position:relative;box-shadow:0 5px 13px -9px #77644860}
#book #bookImage{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;display:block;border-radius:2px;transform:none}
#bookSymbol{position:absolute;right:10px;bottom:10px;width:42px;height:46px;color:#fff4ca;background:#37563cbd;padding:6px;border-radius:50%;pointer-events:none}#bookSymbol svg{width:100%;height:100%;stroke:currentColor;fill:none}
#bookTouch{flex:none;min-height:40px;padding:5px 14px;font:600 12px Oz Sans;border-bottom:1px solid #c7c4a4;color:#647751;letter-spacing:.01em}
#bookReply{font:700 15px/1.8 Oz Story;text-align:center;flex:none;min-height:54px;margin:0;color:#68745a;text-wrap:balance}
#bookCaption{font:400 10px/1.6 Oz Sans;text-align:center;color:#8b8972;margin:7px 0 0}
#bookPlate[data-awake=true]:not([data-reduced=true]) #bookSymbol{animation:ink-bloom 1.4s ease-out}
#bookPlate[data-awake=true]:not([data-reduced=true]) #bookFigure:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 20%,#fff7dc28 50%,transparent 80%);animation:ink-light 1.4s ease-out}
#book .book-kicker{color:#81876c;font:500 11px/1.6 Oz Sans;letter-spacing:.06em}
#bookTitle{font:700 clamp(21px,2.1vw,30px)/1.45 Oz Story;margin:12px 0 19px;color:#425744;letter-spacing:-.02em;text-wrap:balance;outline:none}
#bookBody{flex:1;min-height:0;margin:0;font:450 clamp(16px,1.55vw,19px)/1.95 Oz Sans;letter-spacing:.008em;white-space:pre-wrap;word-break:normal;overflow:hidden;padding:0;text-wrap:wrap}
.story-leaf-footer{margin-top:12px;flex:none;display:flex;align-items:center;gap:10px;height:38px;border-top:1px solid #d7ceb680;color:#87856e;font-size:11px}.story-leaf-footer button{min-height:36px;padding:0 7px;font:500 11px Oz Sans;background:transparent}.story-leaf-footer button:hover{color:#355644}.story-leaf-footer #bookFolio{margin-left:auto;font:700 12px Oz Story}
.story-page-navigation{display:flex;align-items:center;justify-content:center;gap:15px;flex:none;height:40px;color:#7a8067;font-size:11px}.story-page-navigation button{min-height:36px;min-width:38px;background:transparent;font-size:22px;color:#586e50}.story-page-navigation button:disabled{opacity:.3}
#book .story-right>.primary-action{min-height:44px;padding:0 16px;flex:none;align-self:flex-end;margin-top:8px;font-size:14px;border-radius:3px;box-shadow:0 2px 0 #29483738}
.story-ribbon{position:absolute;top:-10px;right:34px;width:18px;height:59px;background:#ac7a6b;clip-path:polygon(0 0,100% 0,100% 100%,50% 84%,0 100%);z-index:7;box-shadow:2px 3px 2px #79523a20;pointer-events:none}
.story-opening-cover{position:absolute;top:0;right:0;bottom:0;width:50%;transform-origin:0 50%;backface-visibility:hidden;z-index:11;background:#7d9374 var(--oz-book-cover,url('assets/oz-runtime-p1/images/books/oz-cover-art-v1.webp')) center/100% 100% no-repeat;border:1px solid #8a987e;border-radius:1px 8px 9px 1px;box-shadow:inset 6px 0 8px #3c593f60,0 6px 20px #28462f45;pointer-events:none;display:flex;align-items:flex-start;justify-content:center;padding:20% 15% 0;color:#f4e2b2}.story-opening-cover span{font:700 clamp(23px,3.5vw,45px)/1.4 Oz Story;white-space:nowrap;text-align:center;letter-spacing:.09em;text-shadow:0 2px #3e654a66}
#bookIndexList{flex:1;min-height:0;overflow:auto;scrollbar-width:thin;padding-right:5px}#bookIndexList button{display:flex;align-items:center;gap:16px;width:100%;min-height:39px;padding:7px 2px;border-bottom:1px solid #cfc8ae70;background:transparent;text-align:left;font:600 13px/1.5 Oz Sans}#bookIndexList button>span:first-child{font:700 19px Oz Story;color:#98a180}#bookIndexList button:hover{color:#365f40;background:#e5e8d14d}
#book #noteLabel{flex:none;font:600 12px/1.6 Oz Sans;margin:12px 0 0}#book #note{height:90px;min-height:60px;max-height:90px;resize:none;font:400 14px/1.7 Oz Sans;background:#fbf6e7;border:1px solid #c4c6a8;padding:8px}
#bookSourcePanel{position:absolute;right:22px;bottom:75px;z-index:10;max-height:65%;overflow:auto;max-width:43%;padding:22px;background:#f5ecd7;border:1px solid #bdb796;box-shadow:0 8px 22px #52624740;border-radius:2px;font:400 12px/1.8 Oz Sans}#bookSourcePanel h3{font:700 16px Oz Story;margin:0 25px 12px 0}#bookSourceClose{float:right;background:none;min-width:30px;min-height:30px;font-size:20px}#bookSourcePanel p{margin:10px 0}
.story-turn{position:absolute;top:0;bottom:0;width:50%;left:50%;transform-origin:0 50%;z-index:9;background:linear-gradient(90deg,#b8a78344,transparent 18%),var(--grain),#fff8e9;backface-visibility:hidden;padding:96px 38px 130px;color:#596450;pointer-events:none;box-shadow:-5px 0 16px #79613e22}.story-turn[data-direction=previous]{left:0;transform-origin:100% 50%;background:linear-gradient(270deg,#b8a78344,transparent 18%),var(--grain),#fff8e9}.story-turn p{margin:0;white-space:pre-wrap;font:450 clamp(16px,1.55vw,19px)/1.95 Oz Sans;overflow:hidden;max-height:100%}.story-turn:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#a4916840,transparent 25%,#fff9e944 82%,#9a87592b);pointer-events:none}
#eventCurtain{position:absolute;inset:0;z-index:15;pointer-events:none;background:linear-gradient(#17332738,transparent 24%,transparent 62%,#1733279c);display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:0 35px 115px;color:#fff4d5}
#eventCurtain[hidden]{display:none}#eventCurtain>div{display:flex;align-items:center;gap:18px;animation:cue-arrive .5s ease-out}#eventCurtain [data-cue-symbol]{width:46px;height:50px;color:#ecdaa9}#eventCurtain svg{width:100%;height:100%;stroke:currentColor;fill:none}#eventCurtain small{font:500 10px Oz Sans;letter-spacing:.2em;opacity:.8}#eventCurtain h2{margin:5px 0 0;font:700 28px/1.5 Oz Story;text-shadow:0 3px 9px #16312970}#eventCurtain button{position:absolute;right:28px;bottom:26px;pointer-events:auto;min-height:44px;padding:8px 18px;background:#fff4d51c;border:1px solid #efdfb56b;border-radius:3px;color:#fff2d0;font-size:13px}
#eventCurtain[data-reduced=true]>div{animation:none}#book[data-reduced=true]{animation:none}#book[data-reduced=true] .story-turn{display:none!important}
#adventure:has(#eventCurtain:not([hidden])) :is(.ribbon,.quest,.actions,.companions,#hint){opacity:0;pointer-events:none}
@keyframes hardcover-reveal{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}@keyframes cue-arrive{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}@keyframes ink-bloom{0%{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.08)}100%{opacity:1;transform:scale(1)}}@keyframes ink-light{from{opacity:0}40%{opacity:1}to{opacity:0}}
@media(max-width:850px){#book{width:calc(100vw - 38px);height:min(540px,calc(100dvh - 60px))}.story-left,.story-right{padding:22px 24px 14px}.story-left{padding-right:28px}.story-right{padding-left:28px}.story-imprint{font-size:9px;margin-bottom:10px}.story-left h3{font-size:17px;margin-bottom:10px}#bookTitle{font-size:23px;margin:10px 0 14px}#bookReply{font-size:13px;min-height:46px}#bookTouch{font-size:11px}#book .book-kicker{font-size:10px}.story-turn{padding:85px 28px 125px}#bookSourcePanel{max-width:45%;padding:16px}#bookIndexList button{font-size:12px;min-height:37px;gap:10px}}
@media(max-height:600px) and (orientation:landscape){#book{height:calc(100dvh - 32px);width:calc(100vw - 40px);padding:8px 8px 12px}.story-left,.story-right{padding:15px 25px 9px}.story-left{padding-right:29px}.story-right{padding-left:29px}.story-imprint{margin-bottom:6px;font-size:8px}.story-left h3{font-size:15px;margin-bottom:6px}#bookTitle{font-size:21px;margin:6px 0 8px}#bookBody{font-size:15px;line-height:1.8}#bookReply{font-size:12px;line-height:1.7;min-height:36px}#bookTouch{min-height:30px;font-size:10px;padding:3px 8px}#bookPlate{gap:4px}#bookCaption{font-size:9px;margin:3px 0 0}.story-leaf-footer{height:30px;margin-top:4px;gap:3px}.story-leaf-footer button{font-size:9px;min-height:30px}.story-page-navigation{height:30px;gap:8px}.story-page-navigation button{min-height:30px;font-size:19px}#book .story-right>.primary-action{min-height:36px;margin-top:3px;font-size:12px}#book .book-kicker{font-size:9px}#book .close-book{top:-13px;right:-12px;min-height:30px;width:30px}.story-ribbon{height:43px;width:15px;right:24px}#book #note{height:63px;max-height:63px;font-size:12px}#book #noteLabel{margin-top:5px;font-size:10px}.story-turn{padding:60px 29px 92px}.story-turn p{font-size:15px;line-height:1.8}#eventCurtain{padding-bottom:75px}#eventCurtain h2{font-size:24px}#eventCurtain button{right:20px;bottom:15px;min-height:36px}#bookIndexList button{font-size:11px;min-height:31px}#bookSourcePanel{bottom:45px;font-size:11px}}
@media(prefers-reduced-motion:reduce){#book[open],#eventCurtain>div,#bookPlate[data-awake=true] #bookSymbol,#bookPlate[data-awake=true] #bookFigure:after{animation:none!important}}