:root { color-scheme: light; }
* { box-sizing: border-box; }
.presentation-page { margin: 0; min-height: 100vh; display: grid; place-items: center; background: #15171a; font-family: system-ui, sans-serif; }
.presentation-page main { width: min(100%, var(--wp-max-width, 1100px)); padding: clamp(.5rem, 2vw, 2rem); }
.wp { --wp-page:#15171a; --wp-accent:#f2b705; --wp-panel:#202328; --wp-text:#fff; --wp-sound-on:#287a3d; --wp-sound-off:#b3261e; --wp-button-text:#fff; --wp-radius:1rem; --wp-image-fit:contain; position:relative; overflow:hidden; width:100%; max-width:var(--wp-max-width, 1200px); background:var(--wp-panel); color:var(--wp-text); border-radius:var(--wp-radius); box-shadow:0 1rem 3rem rgba(0,0,0,.3); }
.presentation-page:has(.wp) { background:var(--wp-page, #15171a); }
.wp:focus-visible { outline:.2rem solid var(--wp-accent); outline-offset:.2rem; }
.wp-intro,.wp-finish { min-height:min(70vh,650px); display:grid; place-items:center; padding:clamp(2rem,6vw,5rem); text-align:center; background:var(--wp-panel); }
.wp-intro { --wp-intro-background:var(--wp-panel); --wp-intro-overlay:rgba(0,0,0,.55); --wp-intro-text:var(--wp-text); --wp-intro-position:center; --wp-intro-align:center; --wp-intro-justify:center; --wp-intro-vertical:center; position:relative; place-items:var(--wp-intro-vertical) center; color:var(--wp-intro-text); background-color:var(--wp-intro-background); background-image:var(--wp-intro-image,none); background-position:var(--wp-intro-position); background-size:contain; background-repeat:no-repeat; text-align:var(--wp-intro-align); }
.wp-intro.has-background-image::before { content:''; position:absolute; inset:0; background:var(--wp-intro-overlay); }
.wp-intro[hidden],.wp-finish[hidden],.wp-player[hidden] { display:none; }
.wp-intro-content,.wp-finish>div { position:relative; z-index:1; width:100%; max-width:45rem; }
.wp-intro .wp-intro-content { opacity:1; visibility:visible; transition:opacity .45s ease; }
.wp-intro.is-image-only .wp-intro-content { opacity:0; visibility:hidden; pointer-events:none; }
.wp-kicker { color:var(--wp-accent); font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.wp-intro h2,.wp-finish h2 { margin:.25rem 0 1rem; font-size:clamp(1.8rem,5vw,3.5rem); }
.wp-intro-text,.wp-intro-hint,.wp-intro h2,.wp-finish p { color:var(--wp-intro-text); }
.wp-intro-text,.wp-finish p { font-size:clamp(1rem,2vw,1.3rem); line-height:1.6; }
.wp-intro-actions { display:flex; flex-wrap:wrap; justify-content:var(--wp-intro-justify); gap:1rem; margin-top:2rem; }
.wp-intro-hint { margin:1rem 0 0; font-size:.95rem; line-height:1.5; opacity:.82; }
.wp button { min-height:2.75rem; padding:.65rem 1rem; border:1px solid #606771; border-radius:.6rem; color:var(--wp-button-text); font:inherit; font-weight:700; cursor:pointer; }
.wp-start-sound,.wp-sound.is-on { background:var(--wp-sound-on); }
.wp-start-silent,.wp-sound.is-off { background:var(--wp-sound-off); }
.wp-start-sound:hover,.wp-start-sound:focus-visible,.wp-sound.is-on:hover,.wp-sound.is-on:focus-visible { filter:brightness(1.18); }
.wp-start-silent:hover,.wp-start-silent:focus-visible,.wp-sound.is-off:hover,.wp-sound.is-off:focus-visible { filter:brightness(1.18); }
.wp-finish button { background:var(--wp-accent); color:#101010; border-color:transparent; }
.wp-stage { position:relative; min-height:260px; background:#090a0b; display:grid; place-items:center; }
.wp-figure { margin:0; width:100%; }
.wp-image { display:block; width:100%; max-height:72vh; aspect-ratio:16/9; object-fit:var(--wp-image-fit); background:#090a0b; }
.wp-caption { position:absolute; inset:auto 0 0; padding:2.5rem 1rem .9rem; text-align:center; font-size:clamp(1rem,2vw,1.35rem); font-weight:700; background:linear-gradient(transparent,rgba(0,0,0,.8)); pointer-events:none; }
.wp .wp-hit { position:absolute; z-index:2; top:0; bottom:0; width:35%; min-height:0; margin:0; padding:0; border:0; border-radius:0; outline:0; appearance:none; -webkit-appearance:none; background:transparent; box-shadow:none; color:#fff; }
.wp-hit--previous { left:0; cursor:w-resize; }.wp-hit--next { right:0; cursor:e-resize; }
.wp-hit::after { position:absolute; top:50%; display:grid; place-items:center; width:2.5rem; height:2.5rem; border-radius:50%; background:rgba(0,0,0,.58); font-size:2rem; line-height:1; opacity:0; transform:translateY(-50%); transition:opacity .16s ease; }
.wp-hit--previous::after { content:'‹'; left:.8rem; }.wp-hit--next::after { content:'›'; right:.8rem; }
.wp-hit:hover::after,.wp-hit:focus-visible::after { opacity:1; }
.wp-progress { height:.3rem; background:#454a52; }.wp-progress span { display:block; width:0; height:100%; background:var(--wp-accent); }
.wp-controls { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.5rem; padding:.75rem; }
.wp-controls button:not(.wp-sound) { background:#30343a; }
.wp-controls button:hover,.wp-controls button:focus-visible { border-color:var(--wp-accent); outline:none; }
.wp-toc { position:relative; }
.wp-counter { min-width:5rem; background:#30343a; text-align:center; font-variant-numeric:tabular-nums; }
.wp-counter::after { content:' ▾'; font-size:.75em; }
.wp-toc-menu { position:absolute; z-index:10; left:50%; bottom:calc(100% + .55rem); width:min(22rem,90vw); max-height:min(24rem,60vh); overflow:auto; padding:.75rem; border:1px solid #606771; border-radius:.65rem; background:#202328; box-shadow:0 .8rem 2rem rgba(0,0,0,.45); transform:translateX(-50%); }
.wp-toc-menu[hidden] { display:none; }
.wp-toc-menu p { margin:0 0 .5rem; font-weight:800; }
.wp-toc-menu ol { margin:0; padding-left:1.8rem; }
.wp-toc-menu li+li { margin-top:.35rem; }
.wp-toc-menu button { width:100%; min-height:2.25rem; padding:.4rem .55rem; background:#30343a; text-align:left; font-weight:600; }
.wp-toc-menu button.is-current { border-color:var(--wp-accent); color:var(--wp-accent); }
.wp-content { margin:0 .9rem .9rem; padding:.7rem .9rem; border:1px solid #454a52; border-radius:.6rem; }
.wp-content summary { cursor:pointer; font-weight:700; }.wp-content>div { padding-top:.6rem; line-height:1.55; }
.wp-content>div>:first-child { margin-top:0; }.wp-content>div>:last-child { margin-bottom:0; }
.wp-error { padding:1rem; border:2px solid #b42318; background:#fee4e2; color:#7a271a; }
.wp:fullscreen { width:100vw; max-width:none; height:100vh; border-radius:0; display:flex; flex-direction:column; }.wp:fullscreen .wp-player { display:flex; flex:1; flex-direction:column; }.wp:fullscreen .wp-stage { flex:1; }.wp:fullscreen .wp-image { height:calc(100vh - 5.5rem); max-height:none; }
@media (prefers-reduced-motion:reduce) { .wp-intro .wp-intro-content { transition:none; } }
@media (hover:none) { .wp-hit:hover::after { opacity:0; }.wp-hit:focus-visible::after { opacity:1; } }
@media (max-width:560px) { .wp-controls { gap:.35rem; }.wp-controls button { padding:.45rem .6rem; }.wp-toc { order:-1; width:100%; }.wp-counter { width:100%; }.wp-intro-actions button { width:100%; } }