/* WordScale - Modals */

#howToOverlay{position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:2000;display:flex;align-items:center;justify-content:center;padding:16px;}
#howToOverlay[hidden]{display:none;}
#howToModal{width:90%;max-width:calc(var(--stage) * 0.9);max-height:calc(100vh - (var(--headerH) + var(--footerH) + 40px));overflow:auto;background:linear-gradient(180deg,var(--panel),var(--panel2));border:1px solid var(--line);border-radius:14px;padding:20px 22px;color:var(--text);position:relative;}
#howToModal h2{margin:0 0 10px;font-size:20px;letter-spacing:.08em;}
#howToModal h3{margin:14px 0 6px;font-size:14px;letter-spacing:.06em;}
#howToModal p{margin:0 0 10px;font-size:13px;line-height:1.45;}
#howToModal ul{margin:8px 0 0 18px;}
#howToModal li{margin:6px 0;font-size:13px;line-height:1.45;}
#howToClose{position:absolute;top:10px;right:12px;background:none;border:0;color:#fff;font-size:22px;line-height:1;cursor:pointer;}
#howToClose:focus{outline:0;}
#howToClose:focus-visible{outline:0;color:#cfe0ff;}

.wordscaleWinModal{width:min(360px,calc(100vw - 32px));border:1px solid #071326;border-radius:14px;background:#071326;color:#fff;padding:22px 24px;text-align:center;box-shadow:0 18px 48px rgba(0,0,0,.45);}
.wordscaleWinModal::backdrop{background:rgba(0,0,0,.48);}
.wordscaleWinModal h2{margin:0 0 8px;font-size:22px;letter-spacing:.02em;}
.wordscaleWinModal p{margin:0 0 18px;color:rgba(255,255,255,.82);font-size:14px;line-height:1.4;}
.wordscaleWinModal .winModalButton{height:36px;min-width:128px;background:#fff;border-color:#fff;color:#0f1422;}
.wordscaleWinModal .winModalButton:hover,
.wordscaleWinModal .winModalButton:focus-visible{outline:0;border-color:#fff;box-shadow:inset 0 0 0 1px rgba(15,20,34,.22);}