.aeren-portrait-required,.aeren-portrait-required body,.aeren-portrait-required .story-scrollport { overflow: hidden !important; }
html.aeren-portrait-required { scrollbar-gutter: auto; background: #eee8e5; }
.aeren-portrait-required body { background: #eee8e5; }
.portrait-notice { position: fixed; inset: var(--portrait-top,0px) auto auto var(--portrait-left,0px); margin: 0; width: var(--portrait-width,100vw); height: var(--portrait-height,100dvh); box-sizing: border-box; max-width: none; max-height: none; border: 0; border-radius: 0; padding: max(16px,env(safe-area-inset-top),env(safe-area-inset-bottom)) max(28px,env(safe-area-inset-left),env(safe-area-inset-right)); background: #eee8e5; color: #25241f; overflow: hidden; }
.portrait-notice[open] { display: grid; align-content: center; justify-items: center; text-align: center; gap: 18px; }
.portrait-notice::before { content: ''; position: absolute; z-index: -1; inset: 0; background: radial-gradient(ellipse at 90% 10%,#ddbbd5,transparent 70%),radial-gradient(ellipse at 90% 110%,#e5aa89,transparent 65%); }
.portrait-notice::backdrop { background: #eee8e5; }
.portrait-notice .portrait-device { width: 54px; height: 68px; fill: none; stroke: #75656e; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.portrait-notice h2 { margin: 0; font: 400 clamp(25px,4vw,36px)/1.2 Sora,sans-serif; letter-spacing: -.055em; }
.portrait-notice p { margin: 0; font: 400 13px/1.6 Inter,sans-serif; color: #776b70; }
.portrait-notice :focus { outline: none; }
@media (max-height:340px) { .portrait-notice[open] { gap: 12px; } .portrait-notice .portrait-device { width: 40px; height: 50px; } }