body { margin:0; font-family:sans-serif; text-align:center; background:coral; color:#fff; }
  .page { display:none; padding:20px; }
  .page img { max-width:80%; height:auto; border-radius:12px; box-shadow:0 0 20px rgba(0,0,0,0.6); }
  .line { font-size:1.5em; margin-top:20px; }
  #controls { display:none; margin-top:30px; }
  button {
    font-size:1.2em; padding:12px 20px; margin:10px;
    border:none; border-radius:10px; cursor:pointer;
    transition:transform 0.2s, box-shadow 0.2s;
  }
  button:hover { transform:scale(1.1); box-shadow:0 0 12px rgba(255,255,255,0.4); }
  #replay { background:crimson; color:white; }
  #next { background:goldenrod; color:white; }

  #fadeSun {
    position: fixed;
    top:0; left:0;
    width:100%; height:100%;
    background: radial-gradient(circle at center,
      rgba(255,255,200,0.8) 0%, rgba(255,255,200,0.4) 40%, transparent 80%);
    opacity:0;
    pointer-events:none;
    transition: opacity 2s ease-in-out;
    z-index:999;
  }
  #fadeSun.show {
    opacity:1;
  }