.screensaver-launch{position:fixed;right:max(24px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));z-index:20;display:flex;align-items:center;justify-content:center;width:46px;height:46px;padding:11px;border:1px solid #ffffff30;border-radius:10px;background:#202221ee;color:#eee;box-shadow:0 3px 18px #0003;transition:background .2s,border-color .2s}
.screensaver-launch:hover{background:#343735;border-color:#ffffff70}.screensaver-launch svg{width:22px;height:22px}
.screensaver{position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;overflow:hidden;background:#0b0d0c;color:#eee;overscroll-behavior:contain}
.screensaver::backdrop{background:#0b0d0c}
.screensaver-surface{position:absolute;inset:0;width:100%;height:100%;background:#0b0d0c;color:#eee;overflow:hidden}
.screensaver-surface:fullscreen{width:100%;height:100%;background:#0b0d0c}
.screensaver-stage,.screensaver-scene{position:absolute;inset:0}
.screensaver-scene{opacity:0;transition:opacity 2s ease}.screensaver-scene.is-visible{opacity:1}
.screensaver-frame{position:absolute;overflow:hidden;background:#0b0d0c}
.screensaver-frame img{width:100%;height:100%;max-width:none;object-fit:contain;animation:screensaver-drift 23s ease-in-out both;animation-direction:var(--direction)}
@keyframes screensaver-drift{from{transform:translate(-.35%,-.25%) scale(var(--zoom-start))}to{transform:translate(.35%,.25%) scale(var(--zoom-end))}}
.screensaver-paused .screensaver-frame img,.screensaver-hidden .screensaver-frame img{animation-play-state:paused}
.screensaver-ui{position:absolute;z-index:2;left:0;right:0;transition:opacity .5s;pointer-events:none}.screensaver-ui button{pointer-events:auto}
.screensaver-top{top:0;padding:20px max(24px,env(safe-area-inset-right));background:linear-gradient(#0009,transparent);font-size:12px;color:#eee;text-shadow:0 1px 4px #000}
.screensaver-bottom{bottom:0;padding:35px 24px max(24px,env(safe-area-inset-bottom));background:linear-gradient(transparent,#000c);text-align:center}
.screensaver-caption{margin:0 auto 14px;max-width:1000px;font-size:14px;line-height:1.5;text-wrap:balance;text-shadow:0 1px 4px #000}.screensaver-controls{display:flex;align-items:center;justify-content:center;gap:8px}
.screensaver-ui button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;background:#202522ed;color:#f1f2ef;border:1px solid #ffffff40;border-radius:7px;padding:10px 15px;font-size:13px}.screensaver-ui button:hover{background:#39413b}.screensaver-ui button:disabled{opacity:.35;cursor:default}
.screensaver-controls svg{width:20px;height:20px}.screensaver [data-action="pause"]{min-width:76px}.screensaver [data-action="exit"] span{margin-left:8px;font-size:18px}
.screensaver-idle,.screensaver-idle .screensaver-surface{cursor:none}.screensaver-idle .screensaver-ui{opacity:0;pointer-events:none}.screensaver-idle .screensaver-ui *{pointer-events:none}.screensaver:focus-within:has(:focus-visible) .screensaver-ui{opacity:1;pointer-events:auto}.screensaver:focus-within:has(:focus-visible) .screensaver-surface{cursor:auto}
.screensaver-status{position:absolute;top:45%;left:20px;right:20px;margin:0;text-align:center;font-size:14px;text-shadow:0 1px 5px #000;pointer-events:none}.screensaver-status:not(:empty){padding:16px;background:#0b0d0ce8}
.screensaver button:focus-visible,.screensaver-launch:focus-visible{outline:2px solid #e3e9dd;outline-offset:4px}
@media(max-width:699px){.screensaver-launch{right:16px;bottom:max(16px,env(safe-area-inset-bottom))}.screensaver-top{padding:16px;font-size:11px}.screensaver-bottom{padding:28px 12px max(16px,env(safe-area-inset-bottom))}.screensaver-controls{gap:6px}.screensaver-ui button{padding:10px 12px}.screensaver-caption{font-size:12px;max-height:54px;overflow:auto}}
@media(prefers-reduced-motion:reduce){.screensaver-frame img{animation:none;transform:scale(var(--zoom-start))}.screensaver-scene,.screensaver-ui{transition:none}}
