/* The framed presentation is scoped to avoid changing readers, saved rooms or native commerce. */
#rotwood-shell{width:100%;max-width:1680px;margin:auto;container-type:inline-size;color:#f8ebce;background:#08120f}
#rotwood-shell *,#rotwood-shell *:before,#rotwood-shell *:after{box-sizing:border-box}
#rotwood-shell [hidden]{display:none!important}
#rotwood-shell button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}
#rotwood-shell button:focus-visible,#rotwood-shell canvas:focus-visible,#rotwood-shell summary:focus-visible,#rotwood-shell a:focus-visible{outline:3px solid #fff0aa;outline-offset:3px}
#rotwood-shell .artboard{position:relative;width:100%;aspect-ratio:1670/941;overflow:hidden;isolation:isolate;background:#10211c}
#rotwood-shell .entrance,#rotwood-shell .opened{position:absolute!important;inset:0!important;display:block;width:100%;height:100%;min-height:0!important;margin:0!important;padding:0!important;background:none;overflow:visible}
#rotwood-shell .closed-art,#rotwood-shell .surround{position:absolute;width:100%;height:100%;inset:0;max-width:none;object-fit:fill;pointer-events:none;user-select:none}
#rotwood-shell .entrance{z-index:3}
#rotwood-shell .hero-breath{position:absolute;inset:0;background:var(--rotwood-closed) center/100% 100% no-repeat;pointer-events:none;animation:rotwood-breathe 8s ease-in-out infinite alternate}
#rotwood-shell .hero-left{mask-image:linear-gradient(90deg,#000 22%,transparent 36%);clip-path:inset(12% 62% 5% 0)}
#rotwood-shell .hero-right{mask-image:linear-gradient(270deg,#000 20%,transparent 35%);clip-path:inset(12% 0 5% 60%);animation-delay:-4s;animation-direction:alternate-reverse}
#rotwood-shell .book-light{position:absolute;left:35%;top:43%;width:30%;height:33%;background:radial-gradient(ellipse,#ffdb7140,transparent 65%);mix-blend-mode:screen;animation:rotwood-glow 5.5s ease-in-out infinite;pointer-events:none}
#rotwood-shell .book-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}
#rotwood-shell #enter-button{position:absolute!important;z-index:2;left:32.5%;top:33%;width:34%;height:44%;min-height:0;max-width:none;padding:0;border:0;border-radius:10%;background:transparent;box-shadow:none;transform:none}
#rotwood-shell #enter-button:focus-visible{outline-offset:-8px}
#rotwood-shell .opened{z-index:1;opacity:0}
#rotwood-shell .artboard[data-state=opening] .entrance{animation:rotwood-recede 5.2s ease-in-out both;pointer-events:none}
#rotwood-shell .artboard[data-state=opening] .opened{animation:rotwood-unfold 5.2s ease-in-out both}
#rotwood-shell .artboard[data-state=open] .opened{opacity:1}
#rotwood-shell .artboard[data-state=open] .entrance{visibility:hidden;pointer-events:none}
#rotwood-shell .artboard[data-state=opening] .hero-breath{animation-play-state:paused}
#rotwood-shell .viewport{position:absolute;left:19.05%;top:22.6%;width:61.5%;height:56.1%;overflow:hidden;border-radius:24px 24px 4px 4px;border:2px solid #e9ba60;box-shadow:inset 0 0 0 3px #3b2514,0 0 14px #ffd56b52;background:#291f14}
#rotwood-shell .viewport:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 20px #35251377;border:2px solid #3e271c88;border-radius:inherit}
#rotwood-shell #rotwood-canvas{display:block;width:100%;height:100%;touch-action:pan-y;cursor:crosshair}
#rotwood-shell .door-layer{position:absolute;inset:0;pointer-events:none}
#rotwood-shell .door{position:absolute;width:70px;height:66px;min-width:44px;min-height:44px;transform:translate(-50%,-100%);border:1px solid transparent;border-radius:50% 50% 12% 12%;background:transparent;pointer-events:auto;padding:0}
#rotwood-shell .door:hover,#rotwood-shell .door:focus-visible{background:radial-gradient(ellipse,#ffde816b,transparent 75%);border-color:#ffe3a16b}
#rotwood-shell .scene-caption{position:absolute;z-index:4;bottom:1.8%;left:0;right:0;text-align:center;pointer-events:none;text-shadow:0 2px 5px #000,0 0 25px #000;font-size:clamp(16px,1.7vw,25px);margin:0;color:#f8df9f;letter-spacing:.06em}
#rotwood-shell .journey-bar{min-height:55px;display:flex;justify-content:flex-end;align-items:center;gap:12px;padding:12px 25px;border-top:1px solid #e2ba6a38;background:#0a1713;font-size:13px}
#rotwood-shell .journey-bar p{margin:0 auto 0 0;color:#d1d1b5;font-size:13px}
#rotwood-shell .journey-bar button,#rotwood-shell .journey-bar summary{font-size:12px;border:1px solid #cab07550;background:#243225;border-radius:3px;padding:6px 11px;white-space:nowrap;cursor:pointer}
#rotwood-shell .journey-bar details{position:relative}
#rotwood-shell .journey-bar nav{position:absolute;right:0;bottom:calc(100% + 8px);z-index:8;background:#14251b;border:1px solid #d2ae5a;min-width:150px;display:grid;padding:8px;gap:4px}
#rotwood-shell .journey-bar a{color:#ffe0a2;padding:8px 12px}
#rotwood-shell .motes{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:4}
#rotwood-shell .motes i{position:absolute;width:3px;height:3px;border-radius:50%;background:#ffe4a3;box-shadow:0 0 8px #f9bb4e;opacity:0;animation:rotwood-drift 12s ease-in-out infinite}
#rotwood-shell #rotwood-fallback{position:absolute;inset:30% 10% auto;padding:14px;background:#14251bee;text-align:center}
#rotwood-shell .courtyard-slot{display:none!important}
#rotwood-shell.calm *,#rotwood-shell.calm *:before,#rotwood-shell.calm *:after{animation:none!important;transition:none!important}
#rotwood-shell.calm .motes{display:none}
@keyframes rotwood-breathe{to{transform:translateY(-1.5px) rotate(.08deg)}}
@keyframes rotwood-glow{50%{opacity:.35;transform:scale(.95)}}
@keyframes rotwood-drift{0%{opacity:0;transform:translate(0,15px)}25%,60%{opacity:.7}100%{opacity:0;transform:translate(24px,-50px)}}
@keyframes rotwood-recede{0%,71%{opacity:1}100%{opacity:0}}
@keyframes rotwood-unfold{0%,66%{opacity:0;transform:translateY(2%) scale(.98)}100%{opacity:1;transform:translateY(0) scale(1)}}
@container (max-width:700px){
  #rotwood-shell .artboard{aspect-ratio:.9}
  #rotwood-shell .closed-art,#rotwood-shell .book-art{width:180%;left:-40%;height:100%}
  #rotwood-shell .hero-breath{background-size:180% 100%}
  #rotwood-shell .hero-left{clip-path:inset(12% 75% 5% 0)}
  #rotwood-shell .hero-right{clip-path:inset(12% 0 5% 75%)}
  #rotwood-shell .surround{width:164%;left:-32%;height:100%}
  #rotwood-shell .viewport{left:3%;width:94%;top:23%;height:56%;border:3px solid #d9ad55;border-radius:18px 18px 5px 5px;box-shadow:0 0 0 3px #5d3b20,0 0 0 5px #c4923e,0 4px 14px #0009}
  #rotwood-shell #enter-button{left:18.5%;width:61%;top:33%;height:44%}
  #rotwood-shell .book-light{left:15%;width:70%}
  #rotwood-shell .scene-caption{font-size:17px}
  #rotwood-shell .journey-bar{flex-wrap:wrap;justify-content:center;padding:10px 14px}
  #rotwood-shell .journey-bar p{font-size:12px;text-align:center;flex:0 0 100%;max-width:100%}
  #rotwood-shell .journey-bar button,#rotwood-shell .journey-bar summary{min-height:38px}
  #rotwood-shell .door{width:48px;height:48px}
}
@media(prefers-reduced-motion:reduce){#rotwood-shell *,#rotwood-shell *:before,#rotwood-shell *:after{animation:none!important;transition:none!important}}
