/* The speakeasy always looks like a dim bar, whatever the site theme. */
body { background: radial-gradient(ellipse at top, #2a1a12, #0c0807 70%); color: #f1e6d6; min-height: 100vh; }
a { color: #e0a95f; }
.door-wrap { max-width: 520px; margin: 0 auto; padding: 72px 16px 48px; }

.door { text-align: center; border: 1px solid #4a3324; border-radius: 14px; padding: 40px 24px 28px; background: rgb(20 12 9 / 0.85); box-shadow: 0 30px 80px rgb(0 0 0 / 0.6); }
.slot { width: 120px; height: 14px; margin: 0 auto 26px; border-radius: 3px; background: #050303; box-shadow: inset 0 2px 4px #000, 0 1px 0 #5a4030; }
.door h1 { font-family: Georgia, "Times New Roman", serif; font-size: 34px; font-weight: 400; letter-spacing: 0.04em; margin: 0 0 8px; }
.hint { color: #b9a58f; font-size: 14px; margin: 0 0 20px; }
#door-form { display: flex; gap: 8px; }
#door-form input { flex: 1; min-width: 0; background: #120b08; border-color: #4a3324; color: #f1e6d6; font-family: Georgia, serif; font-size: 17px; text-align: center; letter-spacing: 0.05em; }
.door .btn, .room .btn { background: #b8732f; color: #140c08; }
.msg { min-height: 1.3em; margin: 12px 0 0; color: #e8806b; font-style: italic; }
.door.shake { animation: shake 0.4s; }
@keyframes shake { 20%, 60% { transform: translateX(-8px); } 40%, 80% { transform: translateX(8px); } }
@media (prefers-reduced-motion: reduce) { .door.shake { animation: none; } }

.room h1 { font-family: Georgia, serif; font-weight: 400; font-size: 38px; margin: 0 0 6px; }
.welcome { color: #b9a58f; font-style: italic; margin: 0 0 24px; }
.room section { border-top: 1px solid #4a3324; padding: 16px 0; }
.room h2 { font-family: Georgia, serif; font-weight: 400; font-size: 21px; margin: 0 0 6px; color: #e0a95f; }
.room .placeholder { opacity: 0.6; font-style: italic; }
.linkish { background: none; border: 0; padding: 0; color: #e0a95f; text-decoration: underline; font-size: inherit; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.dim { color: #b9a58f; }
.room h3 { font-family: Georgia, serif; font-weight: 400; font-size: 17px; margin: 18px 0 6px; color: #f1e6d6; }
.wotd { border: 1px solid #6b4a2f; background: rgb(184 115 47 / 0.12); border-radius: 10px; padding: 12px 14px; margin: 12px 0 4px; }
.wotd span { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: #e0a95f; margin-bottom: 4px; }
.wotd b { font-family: Georgia, serif; font-size: 19px; font-weight: 400; }
.wotd small { display: block; color: #b9a58f; margin-top: 4px; }
.weird-list { margin: 0; padding-left: 20px; }
.weird-list li { margin: 0 0 9px; }
.weird-list small { display: block; color: #b9a58f; }
.tag { display: inline-block; font-size: 11px; padding: 1px 7px; border-radius: 999px; border: 1px solid #e0a95f; color: #e0a95f; margin-left: 6px; vertical-align: 1px; }