:root{font-family:Arial,Helvetica,sans-serif;color-scheme:dark;--top:58px;--bottom:70px;--green:#86e800;--panel:#171717}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#171717;color:#fff}button,input{font:inherit;color:inherit}.viewer{height:100%}.topbar{position:fixed;z-index:40;inset:0 0 auto;height:var(--top);padding:0 16px;display:flex;align-items:center;justify-content:space-between;background:#101010;border-bottom:1px solid #353535}.topbar__actions,.control-group{display:flex;align-items:center;gap:8px}.icon-button{width:40px;height:40px;border:1px solid #555;border-radius:50%;background:#222;display:grid;place-items:center;font-size:22px;line-height:1;cursor:pointer}.icon-button:focus-visible,.icon-button:hover{outline:2px solid var(--green);outline-offset:2px}.stage{position:absolute;inset:var(--top) 0 var(--bottom);display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none}.stage.is-zoomed{cursor:grab}.stage.is-panning{cursor:grabbing}.flipbook{width:min(94vw,1332px);height:min(calc(100vh - 150px),850px);transform-origin:center center;will-change:transform}.page{position:relative;background:#fff;overflow:hidden}.page-image,.page-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}.page-video{z-index:2;background:#000}.page-home{position:absolute;right:3.8%;bottom:2.5%;z-index:8;width:7.2%;max-width:54px;aspect-ratio:1;border:0;border-radius:50%;background:transparent;color:transparent;cursor:pointer}.page-home:focus-visible,.page-home:hover{outline:3px solid #fff;box-shadow:0 0 0 5px var(--green)}.hotspot{position:absolute;z-index:10;border:0;background:transparent;padding:0;cursor:pointer}.hotspot:focus-visible,.hotspot:hover{outline:3px solid #fff;box-shadow:0 0 0 5px var(--green);border-radius:50%}.hotspot--youtube,.hotspot--spotify{min-width:18px;min-height:18px}.page.is-arrival::after{content:"";position:absolute;inset:8px;border:5px solid var(--green);pointer-events:none;z-index:20;animation:arrival 1.8s both}@keyframes arrival{0%,55%{opacity:1}100%{opacity:0}}.controls{position:fixed;z-index:40;inset:auto 0 0;height:var(--bottom);padding:0 14px;display:flex;justify-content:space-between;align-items:center;background:#101010;border-top:1px solid #353535}.controls output{min-width:72px;text-align:center;font-weight:700}.panel-dialog,.media-modal{width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgba(0,0,0,.72)}.panel-dialog::backdrop,.media-modal::backdrop{background:rgba(0,0,0,.72)}.panel-dialog__surface{position:absolute;right:0;top:0;width:min(500px,100%);height:100%;background:var(--panel);box-shadow:-20px 0 60px #000;display:flex;flex-direction:column}.panel-dialog__surface>header,.media-modal__surface>header{padding:18px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #444}.panel-dialog__surface header strong,.panel-dialog__surface header small{display:block}.panel-dialog__surface header strong{font-size:24px}.panel-dialog__surface header small{margin-top:4px;color:#aaa}.toc-list,.search-results{padding:12px;overflow:auto}.toc-item,.search-result{display:grid;grid-template-columns:52px 1fr;gap:8px;width:100%;padding:12px;border:0;border-bottom:1px solid #383838;background:transparent;text-align:left;cursor:pointer}.toc-item strong,.search-result strong{color:var(--green);font-size:17px}.toc-item span,.search-result span{line-height:1.35}.toc-item:hover,.toc-item:focus-visible,.search-result:hover,.search-result:focus-visible{background:#292929;outline:2px solid var(--green)}.search-box{padding:18px;display:grid;gap:7px}.search-box span{font-size:13px;color:#bbb}.search-box input{width:100%;height:46px;padding:0 12px;border:1px solid #666;border-radius:4px;background:#111}.search-empty{padding:18px;color:#bbb}.media-modal__surface{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:min(900px,94vw);max-height:90vh;background:#171717;border:1px solid #555;border-radius:6px;overflow:hidden;box-shadow:0 24px 80px #000}.modal-content{min-height:352px;display:grid;place-items:center;background:#222}.modal-content iframe{width:100%;height:min(62vh,520px);border:0}.modal-content iframe[data-provider="spotify"]{height:352px}.modal-external{display:block;padding:12px 18px;color:var(--green);text-align:right}.media-fallback{max-width:600px;padding:28px;text-align:center}.media-fallback a{color:var(--green)}.jump-toast{position:fixed;z-index:60;left:50%;top:76px;transform:translate(-50%,-16px);max-width:min(90vw,620px);padding:12px 18px;border-radius:4px;background:var(--green);color:#111;font-weight:700;opacity:0;pointer-events:none;transition:.2s}.jump-toast.is-visible{opacity:1;transform:translate(-50%,0)}@media(max-width:640px){:root{--top:52px;--bottom:62px}.topbar{padding:0 8px}.topbar>strong{font-size:12px;max-width:42vw}.topbar__actions{gap:4px}.icon-button{width:36px;height:36px;font-size:19px}.stage{inset:var(--top) 0 var(--bottom)}.flipbook{width:min(96vw,666px);height:min(calc(100vh - 126px),850px)}.controls{padding:0 8px}.control-group{gap:4px}.controls output{min-width:50px;font-size:13px}.panel-dialog__surface{width:100%}.jump-toast{top:62px;font-size:13px}.page-home{width:9%;right:3.5%;bottom:2.2%}.media-modal__surface{width:96vw}.modal-content{min-height:260px}.modal-content iframe{height:56vh}.modal-content iframe[data-provider="spotify"]{height:352px}}