.mystery-dialog{width:min(1100px,100vw);height:100dvh;max-height:100dvh;box-sizing:border-box;display:flex;flex-direction:column;padding:clamp(10px,2vw,24px);gap:8px;background:#fffaf3;color:#075366;overflow:hidden}
.mystery-dialog:not([open]){display:none}.mystery-dialog h2,.mystery-dialog h3,.mystery-dialog p{margin:0}.mystery-dialog h3{font:700 clamp(20px,3vw,32px) 'DM Sans',sans-serif}.mystery-dialog button{background:#e1f1f5;border:1px solid #b8dce2;color:#075366;border-radius:16px;min-height:48px;padding:10px 18px;font-weight:700;box-shadow:none}.mystery-dialog button:disabled{opacity:.65}.mystery-dialog .learning-header{flex:none}.mystery-content{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center}.mystery-content p{max-width:560px}.mystery-status{flex:none;min-height:24px;text-align:center;font-size:14px;color:#825329}.mystery-picture{aspect-ratio:1;width:100%;background-image:url('./mystery-cards.png');background-size:800% 500%;border-radius:22px}.mystery-back{background:#eee7f7;display:grid;place-items:center;font:700 clamp(60px,14vh,140px) 'DM Sans',sans-serif;color:#9c88b3;border:3px dashed #c9b9dc;box-sizing:border-box}.mystery-name{display:block;font-size:clamp(20px,3vh,32px);padding:8px}.mystery-card-face{min-height:0;max-width:380px;width:100%;background:#fffaf1;border:2px solid #dfd9c8;border-radius:26px;padding:12px;box-sizing:border-box;align-self:center}.mystery-round{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(12px,3vw,36px);align-items:center;max-width:900px;min-height:0;width:100%}.mystery-round-info{display:flex;flex-direction:column;gap:18px;align-items:center}.mystery-round-info button{background:#f6edce}.mystery-clock{font-size:clamp(28px,5vh,48px);font-variant-numeric:tabular-nums}.mystery-intro{display:flex;flex-direction:column;gap:8px;align-items:center}.mystery-samples{display:flex;gap:12px}.mystery-samples>div{width:clamp(64px,12vw,130px)}.mystery-samples .mystery-name{display:none}.mystery-lobby{display:grid;grid-template-columns:1fr 1fr;gap:20px;width:min(720px,100%)}.mystery-lobby section{background:#eaf4ec;padding:14px;border-radius:20px;display:flex;flex-direction:column;gap:8px;min-width:0}.mystery-lobby section+section{background:#eee9f7}.mystery-lobby input,.mystery-lobby select{width:100%;box-sizing:border-box;min-height:44px;font-size:18px}.mystery-code{font-size:clamp(28px,7vw,64px);letter-spacing:4px;background:#f5edcf;padding:20px;border-radius:20px}.mystery-ready-picture{width:min(180px,22vh)}.mystery-actions{display:flex;gap:12px}
@media(orientation:portrait){.mystery-round{grid-template-columns:1fr;justify-items:center;gap:12px}.mystery-card-face{width:min(300px,48vh,75vw)}.mystery-round-info{gap:10px}.mystery-lobby{gap:10px}.mystery-samples>div{width:min(100px,22vw)}}
@media(max-height:500px){.mystery-dialog{gap:4px;padding:8px 16px}.mystery-content{gap:7px}.mystery-card-face{width:min(290px,56vh)}.mystery-round{justify-items:center}.mystery-round-info{gap:8px}.mystery-intro{gap:4px}.mystery-samples{display:none}.mystery-lobby section{padding:8px;gap:4px}.mystery-content p{font-size:14px}.mystery-ready-picture{width:65px}.mystery-dialog button{min-height:44px;padding:8px 14px}.mystery-dialog .learning-header h2{font-size:26px}}

.learning-won .mystery-card-face{animation:mystery-dance .65s ease-in-out 6 alternate}@keyframes mystery-dance{from{transform:rotate(-3deg) scale(.97)}to{transform:rotate(3deg) scale(1.02)}}@media(prefers-reduced-motion:reduce){.learning-won .mystery-card-face{animation:none}}