/* 提供画像とヒントダイアログのレイアウト */
#clearDialog{width:min(440px,92vw);padding:38px 28px}#clearTitle{font-size:23px;line-height:1.6;margin-bottom:18px}#clearMessage{font-size:14px;margin:0 0 26px;line-height:1.8}#share{display:block;padding:13px 20px;background:#354761;color:white;text-decoration:none;border-radius:7px;margin-bottom:14px}#clearDialog #return{width:100%}.clear-links{display:flex;justify-content:center;flex-wrap:wrap;gap:12px 20px;margin-top:25px;font-size:12px}.clear-links a{color:#737d8d;text-underline-offset:4px}
#purchaseMessage{margin:0 0 26px;text-align:center;font-size:17px;line-height:1.8}
.explanation{margin-top:16px}
.explanation{max-width:560px;margin:0 auto 22px;padding:16px 20px;background:#f0f3f7;border-radius:8px;color:#4c5868;font-size:14px;line-height:1.9;text-align:left}
.clear-explanation{margin:0 0 28px;text-align:left;font-size:14px;line-height:1.9;color:#4c5868}
#hintPanel .purchase-status{display:inline-flex;align-items:center;gap:6px;margin:8px 0 0;padding:5px 10px;border-radius:20px;background:#edf4ef;color:#49745a;font-size:12px;font-weight:600}
#hintPanel.is-purchased #hintText{margin-top:20px!important;padding:20px 0 8px;border-top:1px solid #e6e9ee;line-height:2;font-size:16px}
#hintPanel.is-purchased .hint-return{width:100%;margin-top:26px;padding:12px;background:#354761;color:#fff;border-radius:7px;font-size:14px}
#answerInstruction{text-align:center;font-size:14px;line-height:1.7;margin:0 0 20px;color:#596473}
#answerForm{margin-top:24px}
#submitAnswer{min-width:100px}
.choice.selected{border-color:#627d9e;box-shadow:0 0 0 2px #627d9e;background:#f3f6fa}
:root{background:#fafafa}main{max-width:820px;padding-top:32px}header{margin-bottom:24px}h1{font-weight:600;letter-spacing:.05em}.board{padding:24px;justify-content:flex-start}
#illustration{height:260px;display:flex;align-items:center;justify-content:center;gap:20px;margin-bottom:24px}#illustration img{display:block;max-width:100%;max-height:100%;margin:0;min-width:0;object-fit:contain}#illustration.paired img{width:calc(50% - 10px)}
#choices{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}#choices[data-count='5']{grid-template-columns:repeat(5,minmax(0,1fr))}.choice{height:120px;min-height:0;min-width:0;padding:13px;background:#fff;touch-action:auto}.choice[data-kind=money]{touch-action:none}.choice img{height:100%;width:100%;object-fit:contain}
.drag-ghost{width:145px;padding:0;background:transparent;border:0;box-shadow:none;filter:drop-shadow(0 6px 8px #0003)}.drag-ghost img{display:block;width:100%;max-height:110px;object-fit:contain}
#hintPanel{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;width:auto;max-width:none;padding:20px;background:#18212d33;border:0;border-radius:0;box-shadow:none;pointer-events:none}.hint-dialog{pointer-events:auto;width:370px;max-width:100%;max-height:calc(100dvh - 40px);overflow:auto;padding:26px;background:white;border:1px solid #edf0f4;border-radius:16px;box-shadow:0 20px 70px #10203026}.hint-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}.hint-head h2{font-size:19px;font-weight:600;margin:0}#hintClose{padding:0;width:30px;height:30px;background:none;border:0;font-size:24px;color:#7f8792}#hintPanel .hint-question{font-size:12px;color:#8b939f;margin:0 0 9px}.hint-description{font-size:15px}
#hintPanel #price{font-family:Arial,sans-serif;font-size:clamp(23px,6vw,30px);font-weight:600;letter-spacing:-.02em;margin:24px 0;white-space:nowrap}.hint-purchase{border-top:1px solid #edf0f3;padding-top:23px;text-align:left}#purchase{width:100%;background:#354761;color:white;border:0;font-size:14px;padding:14px 8px}.slot-housing{width:80px;margin:16px auto 0;padding:6px 8px;background:#f7f8fa;border:0;border-radius:4px}.slot{height:4px;background:#c6cbd2}.slot.accepting{background:#8191a7}#hintPanel #hintText{font-size:15px;line-height:1.9;margin-top:20px!important}.hint-return{display:block;margin:17px auto 0;padding:2px 10px;border:0;background:none;font-size:12px;color:#828b98}.dragging .hint-dialog{pointer-events:none}.dragging #hintPanel{background:#18212d15}
@media(max-width:540px){main{padding:24px 16px}.board{padding:16px}#illustration{height:220px;gap:12px}#illustration.paired img{width:calc(50% - 6px)}#choices{gap:8px}#choices[data-count='5']{grid-template-columns:repeat(3,minmax(0,1fr))}.choice{height:95px;padding:9px}#choices[data-count='5'] .choice:nth-child(n+4){height:75px}.hint-dialog{padding:24px}}