/* Public reader stage. Screen clipping belongs to .device, never this outer host. */
html,body{margin:0;min-height:100%;background:#0b0b0d}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(ellipse at 50% 40%,#28282d 0%,#1a1a1e 38%,#101012 68%,#09090b 100%);background-attachment:fixed}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23grain)' d='M0 0h160v160H0z'/%3E%3C/svg%3E");mix-blend-mode:soft-light}
.reader-main{position:relative;min-height:100svh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:clamp(24px,6dvh,48px) 24px;box-sizing:border-box}
.reader-phone.dialog-player{width:min(410px,100%);padding:0;max-height:none;overflow:visible;background:transparent}
.reader-phone #phone-slot,.reader-phone .phone-preview-viewport,.reader-phone .phone-preview-stage{overflow:visible}
.reader-phone #phone-slot{width:100%}
.reader-phone{--phone-case-shadow:#0009}
#toast{left:50%}