.reception { --reception-width:900px; margin-top: clamp(24px, 5vw, 72px); }
.reception-header, .reception-screen, .reception-actions { max-width:var(--reception-width); margin-inline:auto; }
.universe:not(.universe-ready) .story-world + .universe-window { margin-top: 54px; }
.reception-header { display: flex; justify-content: space-between; gap: 24px; align-items: end; margin-bottom: 20px; }
.reception-header h4 { margin: 8px 0 0; font: 400 clamp(30px, 4vw, 52px)/1.06 var(--serif); }
.reception-header p { max-width: 38ch; margin: 0; font-size: 16px; line-height: 1.6; color: #bbc4b3; }
.reception-screen { position:relative; overflow: hidden; border: 1px solid #a4b29b55; border-radius: 12px; background: #111411; box-shadow: 0 24px 90px #0004; }
.reception-screen > img { display: block; width: 100%; max-height: 560px; object-fit: cover; }
.reception-screen > img[hidden] { display: none; }
.reception-screen iframe { display: block; width: 100%; height: 800px; border: 0; color-scheme: dark; }
.reception-screen iframe.reception-preparing { position:absolute; inset:0; opacity:0; pointer-events:none; }
.reception-loading { position:absolute; inset:0; z-index:1; display:grid; place-content:center; gap:16px; padding:24px; background:#101a15d9; backdrop-filter:blur(4px); }
.reception-loading[hidden] { display:none; }
.reception-loading p { margin:0; font-size:16px; line-height:1.5; color:#eee4d3; }
.reception-loading progress { width:100%; min-width:180px; height:10px; accent-color:#dfc49a; }
.reception-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 14px 24px; padding-top: 18px; }
.reception-actions button { min-height: 44px; padding: 12px 22px; border-radius: 100px; border: 1px solid #d5c9aa; color: #eee4d3; background: #1f3026; font: inherit; cursor: pointer; }
.reception-actions button:hover { color: #1d3025; background: #eee4d3; }
.reception-actions button:focus-visible { outline: 2px solid #e5c38c; outline-offset: 5px; }
.reception-actions p { margin: 0; max-width: 60ch; font-size: 14px; color: #b9c5af; line-height: 1.6; }
@media (max-width: 600px) {
  .reception-header { display: block; }
  .reception-header > p { margin-top: 16px; }
  .reception-screen iframe { height: clamp(760px, calc(133vw + 250px), 1050px); }
  .reception-actions button { width: 100%; }
}