.first-room{position:relative}.first-prompt{z-index:5;flex-direction:column;align-items:center;gap:16px;width:min(400px,100vw - 32px);display:flex;position:absolute;top:50%;left:50%;translate:-50% -44%}.first-card{width:100%;font-family:var(--font-card), ui-monospace, monospace;color:#2a2016;background:linear-gradient(#ffffff8c 0 1px,#fff0 1px),linear-gradient(178deg,#f0e8d6 0%,#e8dfc9 100%);border-radius:1px;flex-direction:column;gap:12px;padding:18px 22px 28px;display:flex;position:relative;rotate:-.6deg;box-shadow:0 24px 44px -18px #000000bf,0 2px 6px #00000059,inset 0 0 0 1px #78603c38}.first-card:after{content:"";background:#3c2c1c57;border-radius:50%;width:9px;height:9px;position:absolute;bottom:7px;left:50%;translate:-50%;box-shadow:inset 0 1px 1px #0006}.first-card__rule{letter-spacing:.16em;text-transform:uppercase;color:#2a2016b3;border-bottom:1px solid #963c3247;justify-content:space-between;padding-bottom:8px;font-size:10px;display:flex}.first-card__question{font-family:var(--font-body), Georgia, serif;color:#241c14;text-wrap:balance;margin:0;font-size:23px;line-height:1.2}.first-card__hint{color:#2a2016b8;margin:0;font-size:12px;line-height:1.5}.first-card__input{font:15px/1.3 var(--font-body), Georgia, serif;color:#241c14;background:#ffffff73;border:0;border-bottom:1px solid #2a201673;outline:none;padding:8px 2px}.first-card__input::placeholder{color:#2a201680}.first-card__input:focus{border-bottom-color:#8f1d24}.first-card__results{flex-direction:column;margin:-4px 0 0;padding:0;list-style:none;display:flex}.first-card__results button{text-align:left;cursor:pointer;border-radius:2px;align-items:center;gap:10px;width:100%;padding:6px 4px;display:flex}.first-card__results button:hover{background:#2a201612}.first-card__thumb{object-fit:cover;background:#2a20161f;border-radius:1px;flex-shrink:0;width:28px;height:40px}.first-card__book{flex-direction:column;min-width:0;display:flex}.first-card__title{font:15px/1.25 var(--font-body), Georgia, serif;color:#241c14}.first-card__meta{color:#2a2016b3;font-size:11px;line-height:1.4}.first-card__picked{background:#ffffff59;border:1px solid #78603c40;align-items:center;gap:10px;padding:8px;display:flex}.first-card__picked .first-card__book{flex:1}.first-card__rating{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.first-card__stars{gap:1px;display:flex}.first-card__stars button{color:#2a201638;cursor:pointer;padding:0 1px;font-size:18px;line-height:1}.first-card__stars button[data-on]{color:#a8792a}.first-card__score{font-variant-numeric:tabular-nums;color:#2a2016b3;font-size:11px}.first-card__problem{color:#8c2f21;margin:0;font-size:11px}.first-card__actions{flex-wrap:wrap;align-items:center;gap:14px;margin-top:4px;display:flex}.first-card__primary{font:700 11px var(--font-card), ui-monospace, monospace;letter-spacing:.14em;text-transform:uppercase;color:#f0e8d6;cursor:pointer;background:#241c14;border-radius:2px;padding:10px 14px}.first-card__primary:hover{background:#3a2e24}.first-card__primary:disabled{opacity:.6;cursor:default}.first-card__quiet{font:11px var(--font-card), ui-monospace, monospace;letter-spacing:.12em;text-transform:uppercase;color:#2a2016b8;text-underline-offset:4px;cursor:pointer;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.first-card__quiet:hover{color:#241c14}.first-escape{font:11px var(--font-card), ui-monospace, monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--color-parchment-dim);text-underline-offset:4px;cursor:pointer;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.first-escape:hover{color:var(--color-parchment)}.first-escape:focus-visible{outline:2px solid var(--color-brass-bright);outline-offset:3px}.first-card button:focus-visible,.first-card input:focus-visible{outline-offset:2px;outline:2px solid #8f1d24}.first-ghost{display:contents}.first-ghost .spine{box-shadow:none;outline-offset:-1.5px;cursor:default;outline:1.5px dashed #c4a468bf;animation:2.4s ease-in-out infinite first-breathe;background:0 0!important}.first-ghost .spine:before,.first-ghost .spine:after{display:none}.first-ghost .spine>*{visibility:hidden}@keyframes first-breathe{50%{outline-color:#c4a4684d}}.first-arrived{display:contents}.first-arrived>.spine{animation:.65s cubic-bezier(.2,.8,.2,1) both first-arrive}@keyframes first-arrive{0%{opacity:0;translate:0 -14px}}@media (prefers-reduced-motion:reduce){.first-ghost .spine,.first-arrived>.spine{animation:none}}