/* Draw a question to take back to a paper journal. */
.prompt-page {width:min(100% - 40px,800px); margin:0 auto; padding:40px 0 72px; overflow-x:clip;}
.prompt-heading {margin:0 0 35px; text-align:center;}
.prompt-heading h1 {margin:0 0 9px; color:var(--ink); font-size:clamp(1.65rem,3.5vw,2.25rem); line-height:1.4; letter-spacing:-.035em;}
.prompt-heading p {margin:0; color:var(--muted); font-size:.95rem; line-height:1.75;}
.prompt-stage {display:grid; justify-items:center; gap:26px; padding:8px 14px 0;}
.prompt-deck {position:relative; width:min(100%,640px); isolation:isolate;}
.prompt-stack {position:absolute; inset:0; z-index:-1; border:1px solid var(--line); border-radius:24px; background:var(--card); transform-origin:50% 80%;}
.prompt-stack--back {transform:rotate(-4deg) translateY(5px); opacity:.55;}
.prompt-stack--middle {transform:rotate(3deg) translateY(2px); opacity:.85;}
.prompt-card {position:relative; display:flex; flex-direction:column; min-height:340px; padding:27px 40px 34px; border:1px solid var(--line); border-radius:24px; background:var(--card); box-shadow:var(--shadow);}
.prompt-question-meta {display:flex; align-items:center; justify-content:center; gap:9px; color:var(--muted); font-size:.8rem;}
.prompt-question-meta img {display:block; width:58px; height:auto;}
.prompt-question-window {position:relative; display:grid; flex:1; align-items:center; padding:19px 0 10px;}
.prompt-question-window h2,.prompt-roulette {margin:0; color:var(--ink); font-size:clamp(1.35rem,3vw,1.95rem); font-weight:700; line-height:1.75; letter-spacing:-.02em; text-align:center; overflow-wrap:anywhere;}
.prompt-roulette {position:absolute; inset:19px 0 10px; display:none; align-items:center; opacity:.55; overflow:hidden;}
.prompt-next {display:flex; align-items:center; justify-content:center; gap:11px; min-width:210px; max-width:100%; min-height:52px; padding:13px 25px; border:1px solid var(--accent); border-radius:15px; background:var(--accent); color:var(--on-accent); font:inherit; font-weight:700; line-height:1.3; cursor:pointer;}
.prompt-next:hover {filter:brightness(1.08);}
.prompt-next:disabled {cursor:wait;}
.prompt-dice {width:23px; height:23px; flex:none;}
.prompt-bridge {display:flex; align-items:flex-start; gap:15px; max-width:650px; margin:43px auto 0; padding:0 8px;}
.prompt-bridge img {width:48px; height:auto; flex:none; margin-top:1px;}
.prompt-bridge h2 {margin:0 0 5px; color:var(--ink); font-size:.9rem; line-height:1.5;}
.prompt-bridge p {margin:0 0 7px; color:var(--muted); font-size:.8rem; line-height:1.75;}
.prompt-bridge a {color:var(--accent); font-size:.8rem; text-underline-offset:3px;}
.prompt-examples {margin-top:35px;}
.prompt-examples h2 {font-size:1.1rem;}
.prompt-examples ul {padding-inline-start:20px; color:var(--muted);}
.prompt-usage {margin-top:36px;}
.prompt-usage h2 {font-size:1.1rem;}
.prompt-usage p {margin-bottom:0; color:var(--muted); font-size:.95rem; line-height:1.85;}
.prompt-examples li + li {margin-block-start:7px;}
.prompt-page [hidden] {display:none;}
.prompt-tool--nojs .prompt-next {display:none;}
.prompt-page button:focus-visible,.prompt-page a:focus-visible {outline:3px solid var(--glow); outline-offset:4px;}
.prompt-sr {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0;}
.is-shuffling .prompt-stack--back {animation:prompt-shuffle-back .82s ease-in-out;}
.is-shuffling .prompt-stack--middle {animation:prompt-shuffle-middle .82s ease-in-out;}
.is-shuffling .prompt-card {animation:prompt-shuffle-front .82s ease-in-out;}
.is-shuffling .prompt-dice {animation:prompt-roll .82s ease-out;}
.is-shuffling [data-prompt-question] {visibility:hidden;}
.is-shuffling .prompt-roulette {display:grid;}
.is-shuffling .prompt-roulette span {animation:prompt-pass .16s ease-in-out infinite;}
@keyframes prompt-shuffle-back {30%,65% {transform:rotate(-9deg) translate(-25px,-7px);} 90% {transform:rotate(-2deg) translateY(4px);}}
@keyframes prompt-shuffle-middle {25%,60% {transform:rotate(8deg) translate(25px,-8px);} 90% {transform:rotate(2deg) translateY(2px);}}
@keyframes prompt-shuffle-front {25% {transform:translateY(-7px) rotate(-1deg);} 60% {transform:translateY(-3px) rotate(1deg);} 85% {transform:translateY(2px);}}
@keyframes prompt-roll {from {transform:rotate(-100deg);} to {transform:rotate(0);}}
@keyframes prompt-pass {from {opacity:.1; transform:translateY(14px);} to {opacity:.8; transform:translateY(-14px);}}
@media (max-width:700px) {
  .prompt-page {width:calc(100% - 32px); padding-top:23px;}
  .prompt-heading {margin-bottom:29px;}
  .prompt-heading h1 {font-size:1.65rem;}
  .prompt-heading p {font-size:.86rem; line-height:1.65;}
  .prompt-stage {padding:4px 10px 0; gap:25px;}
  .prompt-card {min-height:305px; padding:19px 24px 29px; border-radius:20px;}
  .prompt-stack {border-radius:20px;}
  .prompt-question-meta {font-size:.75rem;}
  .prompt-question-meta img {width:52px;}
  .prompt-question-window h2,.prompt-roulette {font-size:1.35rem; line-height:1.8;}
  .prompt-next {min-width:200px; font-size:.95rem;}
  .prompt-bridge {margin-top:37px; padding:0;}
}
@media (prefers-reduced-motion:reduce) {.prompt-page *, .prompt-page *::before,.prompt-page *::after {animation:none !important;}}
