:root{--sky:#00aeee;--ink:#111827;--card:#fff;--accent:#0e7490;--accent-ink:#fff;color:var(--ink);font-family:ui-rounded,Arial Rounded MT Bold,system-ui,sans-serif}*{box-sizing:border-box}html,body{background:var(--sky);margin:0}main{max-width:1400px;margin:0 auto;padding:16px}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}#stage{width:100%;min-width:min(100%,320px);max-width:calc(198svh - 554.4px);margin:0 auto}@media (orientation:landscape) and (height<=500px){#stage{max-width:none}}#book{margin:0 auto;transition:transform .5s}#book[data-position=front]{transform:translate(-25%)translateZ(0)}#book[data-position=back]{transform:translate(25%)translateZ(0)}@media (prefers-reduced-motion:reduce){#book{transition:none}}.page{background:#fff;overflow:hidden}.page img{object-fit:cover;width:100%;height:100%;display:block}.page.back{background:var(--sky);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:4%;font-size:clamp(10px,2.2vw,28px);display:flex}.page.back img{border-radius:6px;width:55%;height:auto}#controls{background:var(--card);border-radius:16px;justify-items:center;gap:12px;max-width:720px;margin:16px auto;padding:16px;display:grid;box-shadow:0 4px 16px #0002}#reader{justify-items:center;gap:12px;width:100%;display:grid}#reader[hidden],#rotate-hint[hidden],#open[hidden]{display:none}.row{gap:16px;display:flex}#spotify{width:100%;min-height:80px}button,.links a{font:inherit;background:var(--accent);color:var(--accent-ink);cursor:pointer;border:0;border-radius:999px;padding:10px 20px;font-size:18px;text-decoration:none}button.big{padding:14px 32px;font-size:24px}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--ink);outline-offset:2px}.switch{align-items:center;gap:8px;font-size:16px;display:flex}.switch input{width:20px;height:20px}#rotate-hint{align-items:center;gap:8px;margin:0;font-size:16px;display:flex}#rotate-hint button{padding:4px 10px;font-size:14px}.links{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}footer{text-align:center;padding:8px 0 24px;font-size:14px}#about{background:var(--card);border-radius:16px;max-width:720px;margin:0 auto 16px;padding:16px 24px;line-height:1.5}#about h2{margin:0 0 8px;font-size:22px}#about ul{margin:0;padding-left:20px}#about .original{color:#4b5563;font-size:.9em}#about details{margin-top:12px}#about summary{cursor:pointer;font-weight:600;list-style:none}#about summary::-webkit-details-marker{display:none}#about summary:before{content:"▸";text-align:center;width:1.2em;transition:transform .2s;display:inline-block}#about details[open] summary:before{transform:rotate(90deg)}#about details ul{margin-top:8px}@media (prefers-reduced-motion:reduce){#about summary:before{transition:none}}footer a{color:inherit}