#result{position:fixed;inset:0;z-index:9000;}
#result .resultBox{width:min(760px,calc(100% - 28px));height:auto;min-height:0;max-height:calc(100dvh - 28px);align-self:center;overflow:auto;padding:18px;border-radius:24px;box-sizing:border-box;}
#result .resultBox:not(.king){background:linear-gradient(135deg,#244a9a,#15336f);}
#result .resultBox:not(.rank-z):not(.king){border:2px solid rgba(210,245,255,.7);}
#result .resultBox.rank-z{border-width:3px;border-color:rgba(79,195,255,.75);}
#result .resultBox.king{border:3px solid rgba(255,210,70,.9);}
body.quest-result-name #result .resultBox{width:min(640px,calc(100% - 28px));max-width:640px;}
#result .resultBig,#result .resultRank{
  background:none;color:var(--quest-rank-color,#fff);-webkit-text-fill-color:var(--quest-rank-color,#fff);
}
#result .resultSame{background:none;color:#fff;text-align:center;}
#result .btnRow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:min(188px,100%);gap:12px;margin:18px auto 0;}
#result .miniBtn{box-sizing:border-box;width:100%;min-width:0;height:40px;min-height:40px;padding:0 6px;border:1px solid #ffffffb3;border-radius:10px;background:#10244ec0;color:#fff;font:600 13px/1.2 system-ui;box-shadow:none !important;text-shadow:none;}
#result .questResultReturn{padding:0;background:none;border:0;}
#result .questResultReturn img{display:block;width:100%;height:40px;object-fit:contain;}
#result .questResultReturn .questResultEn{display:none;}
html[lang="en"] #result .questResultReturn .questResultJa{display:none;}
html[lang="en"] #result .questResultReturn .questResultEn{display:block;}
.questResultLanguage{display:flex;justify-content:flex-end;gap:4px;margin-bottom:8px;}
.questResultLanguage button{min-height:32px;padding:4px 10px;border:1px solid #ffffff66;border-radius:8px;background:transparent;color:#fff;font:600 12px/1.3 system-ui;cursor:pointer;}
.questResultLanguage button[aria-pressed="true"]{border-color:#ffe078;color:#ffe078;background:#132f59;}
.questPrefectureReward{display:block;margin:12px auto 0;min-height:40px;padding:6px 12px;border:1px solid #ffffffb3;border-radius:10px;background:#10244ec0;color:white;font:600 13px/1.4 system-ui;cursor:pointer;}
.questPrefectureReward:disabled{opacity:.35;color:#c2c8d1;border-color:#667386;cursor:default;}
.questPrefectureReward.is-mastered:disabled{opacity:1;color:#fff;-webkit-text-fill-color:#fff;border-color:#ffe078;background:linear-gradient(180deg,#e8c967,#bf8b21);font-weight:700;cursor:default;}
.questPrefectureReward.is-mastered span{background:linear-gradient(180deg,#ffffff 0%,#f4fbff 20%,#c2d1e1 42%,#e6f0fa 48%,#ffffff 51%,#ffffff 58%,#bed0e2 76%,#f6fbff 100%);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;filter:drop-shadow(0 1px 1px #533e1b);}
.questPrefectureConfetti{position:fixed;top:-60px;z-index:10000;pointer-events:none;touch-action:manipulation;cursor:pointer;object-fit:contain;animation:quest-prefecture-fall linear both;}
.questShowerHint{position:fixed;left:12px;right:12px;margin:0;z-index:10001;pointer-events:none;text-align:center;color:#fff;-webkit-text-fill-color:#fff;line-height:1.2;text-shadow:none;white-space:pre-line;}
.questShowerHint[hidden]{display:none;}
#result .resultBox.is-showering :is(a,button){opacity:.35;pointer-events:none;cursor:default;}
.questPrefectureCorrect{position:fixed;z-index:10008;transform:translate(-50%,-50%);pointer-events:none;color:#009e73;-webkit-text-stroke:2px white;font:800 72px/1 system-ui;text-shadow:0 0 4px #fff;}
@keyframes quest-prefecture-fall{
  0%{transform:translate(0,-40px) rotate(0deg);opacity:0;}
  8%,85%{opacity:1;}
  50%{transform:translate(calc(var(--pref-drift) * .5),calc(50dvh + 30px)) rotate(var(--pref-sway));}
  100%{transform:translate(var(--pref-drift),calc(100dvh + 100px)) rotate(0deg);opacity:0;}
}

.questPrefectureConfetti *{pointer-events:none;}
.questPrefectureConfetti.is-clickable [data-map-layer="prefectures"]{pointer-events:visiblePainted;}

.questShowerRemaining{margin:8px 0 0;text-align:right;color:#fff;-webkit-text-fill-color:#fff;font:600 14px/1.4 system-ui;white-space:nowrap;}
.questShowerRemaining[hidden]{display:none;}

.questShowerRemaining{white-space:pre-line;}
.questShowerCompletion{margin:12px 0 0;text-align:center;white-space:pre-line;color:#fff;-webkit-text-fill-color:#fff;font:700 20px/1.4 system-ui;}
.questShowerCompletion[hidden]{display:none;}
.questPrefectureReward[hidden]{display:none;}
@media (hover:hover){.questPrefectureConfetti.is-clickable:hover{filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 8px #fff);}.questPrefectureConfetti.is-clickable:hover [data-map-layer="prefectures"]{stroke:#fff;stroke-width:3;}}
.questPrefectureConfetti.is-clickable:focus-visible{filter:drop-shadow(0 0 8px #fff);outline:none;}

.questShowerQuestion{margin:14px 0;text-align:center;pointer-events:none;}
.questShowerQuestion p{margin:0;color:#ffe76b;-webkit-text-fill-color:#ffe76b;font:800 clamp(22px,3.5vw,34px)/1.3 system-ui;overflow-wrap:anywhere;}
.questShowerQuestion[hidden]{display:none;}
.questShowerShapeNote{margin-top:6px;color:#fff0bd;font:600 clamp(11px,min(2vw,3dvh),16px)/1.35 system-ui;text-align:center;}
.questShowerShapeNote[hidden]{display:none;}
.questShowerQuestionMap svg{display:block;width:100%;height:120px;margin:8px auto 0;}

/* The catch question only occupies space while a challenge is active. */
.questShowerQuestion{height:calc(clamp(22px,3.5vw,34px) * 1.3);display:grid;align-content:start;}
.questShowerQuestion.has-map{height:calc(clamp(22px,3.5vw,34px) * 1.3 + 128px);}
.questShowerQuestion[hidden]{display:none;}
.questShowerQuestion p{height:calc(clamp(22px,3.5vw,34px) * 1.3);}
.questShowerRewardRow{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:12px;}
.questShowerRewardRow .questPrefectureReward{margin:0;min-width:0;}
.questShowerRewardRow .questShowerRemaining{margin:0;flex-shrink:0;}
#result .questRetryDisabled{opacity:.35;pointer-events:none;cursor:default;}

.questShowerQuestion.has-map p{height:calc(clamp(22px,3.5vw,34px) * 1.3);}

/* Keep the question slot stable during catch feedback and automatic advancement. */
#result .resultBox.is-showering .questShowerQuestion[hidden]{
  display:grid;visibility:hidden;
}

/* Hold a wrong shower choice in place before showing the retry message. */
.questPrefectureWrong{position:fixed;z-index:10009;transform:translate(-50%,-50%);display:grid;place-items:center;width:1.1em;height:1.1em;border-radius:50%;background:#fffffff2;color:#ec3448;font:900 clamp(54px,9vmin,90px)/1 system-ui;box-shadow:0 2px 14px #101c4d55;pointer-events:none;}
.questPrefectureConfetti.is-wrong{filter:drop-shadow(0 0 8px #ff455a)!important;}
body.hkt-game[data-shower-mode="4"] #result .resultBox{width:36vw;max-width:92vw;max-height:88dvh;min-width:0;overflow:auto;}
@media(orientation:portrait){body.hkt-game[data-shower-mode="4"] #result .resultBox{width:86vw;}}
@media(orientation:landscape) and (max-aspect-ratio:4/3){body.hkt-game[data-shower-mode="4"] #result .resultBox{width:48vw;}}

/* A compact result card shared by regional and national game modes. */
body #result .resultBox,body.quest-result-name #result .resultBox{width:36vw;max-width:92vw;max-height:88dvh;min-width:0;overflow:auto;}
@media(orientation:portrait){body #result .resultBox,body.quest-result-name #result .resultBox{width:86vw;}}
@media(orientation:landscape) and (max-aspect-ratio:4/3){body #result .resultBox,body.quest-result-name #result .resultBox{width:48vw;}}

/* Keep every mini-shower prompt above the falling choices. */
.questShowerQuestion.is-overlay{position:fixed;z-index:10005;top:max(12px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 32px);height:auto;margin:0;padding:10px 18px;border:2px solid #ffe76b;border-radius:14px;background:#17345bf5;box-sizing:border-box;}
.questShowerQuestion.is-overlay p{height:auto;}
.questShowerQuestion.is-overlay .questShowerQuestionMap svg{width:min(220px,55vw);height:min(120px,20dvh);margin:8px auto 0;}
.questShowerQuestion.is-overlay.is-name-catch{top:auto;bottom:max(12px,env(safe-area-inset-bottom));}
.questPrefectureConfetti.is-name-choice{z-index:10006;}

/* Width and height both matter: a short landscape phone needs smaller type. */
body #result .resultBox{
  --result-heading-size:clamp(18px,3.2vmin,40px);
  --result-heading-size:clamp(18px,min(3.2vw,5dvh),40px);
  --result-body-size:clamp(16px,2.8vmin,32px);
  --result-body-size:clamp(16px,min(2.8vw,4.2dvh),32px);
  --result-control-size:clamp(12px,1.6vmin,16px);
  --result-control-size:clamp(12px,min(1.6vw,3dvh),16px);
  --result-gap:clamp(6px,1.4vh,14px);
  --result-gap:clamp(6px,1.4dvh,14px);
  padding:clamp(8px,2vmin,18px);
  max-height:calc(100vh - 16px - var(--safeT,0px) - var(--safeB,0px)) !important;
  max-height:calc(100dvh - 16px - var(--safeT,0px) - var(--safeB,0px)) !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  overscroll-behavior-y:contain;
  touch-action:pan-y pinch-zoom;
  -webkit-overflow-scrolling:touch;
}
#result :is(.resultBig,.resultSame,.resultRank){
  height:auto;min-height:0;line-height:1.3;
  white-space:nowrap;overflow:visible;text-overflow:clip;overflow-wrap:normal;
}
#result :is(.resultSame,.resultRank):empty{display:none;}
#result .resultBig{font-size:var(--result-heading-size);}
#result :is(.resultSame,.resultRank){font-size:var(--result-body-size);margin-top:var(--result-gap);}
#result .btnRow{margin-top:var(--result-gap);}
#result .questResultLanguage{margin-bottom:var(--result-gap);}
#result .questShowerRewardRow{margin-top:var(--result-gap);flex-wrap:wrap;gap:var(--result-gap);}
#result :is(.miniBtn,.questPrefectureReward,.questShowerRemaining,.questResultLanguage button){font-size:var(--result-control-size);}
#result .questShowerCompletion{font-size:var(--result-body-size);overflow-wrap:anywhere;}
.questShowerUnlockHint {margin:8px 0 0;text-align:center;color:#d5deec;font:600 12px/1.5 system-ui;white-space:normal;}
.questShowerUnlockHint[hidden] {display:none!important;}
.questPrefectureBlizzard {position:fixed;top:-45px;z-index:10010;pointer-events:none;object-fit:contain;animation:quest-prefecture-blizzard linear both;}
@keyframes quest-prefecture-blizzard {0%{transform:translate(0,-35px) rotate(0deg);opacity:0}8%,85%{opacity:1}100%{transform:translate(var(--prefecture-drift),calc(100dvh + 80px)) rotate(var(--prefecture-spin));opacity:0}}
#result .btnRow,#result .questShowerRewardRow {display:grid;grid-template-columns:repeat(2,88px);width:188px;max-width:100%;gap:12px;justify-content:center;align-items:center;}
#result .questShowerRewardRow {margin:12px auto 0;}
#result .questShowerRewardRow .questPrefectureReward,#result .questShowerRewardRow .questPrefectureBlizzardReward {
  display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:88px;min-width:0;height:40px;min-height:40px;
  margin:0;padding:4px;border:1px solid #ffffffb3;border-radius:10px;background:#10244ec0;color:#fff;font:600 12px/1.3 system-ui;cursor:pointer;
}
#result .questShowerRewardRow .questPrefectureReward {font-size:10px;padding:4px 2px;letter-spacing:0;white-space:nowrap;}
#result .questShowerRewardRow button:disabled {opacity:.35;color:#c2c8d1;border-color:#667386;cursor:default;}
#result .questShowerRewardRow button[hidden],#result .questShowerRewardRow .questShowerRemaining[hidden] {display:none;}

/* Wrong-answer names stay next to the silhouette they describe. */
.questShowerWrongAnswer{position:fixed;z-index:10011;max-width:calc(100vw - 16px);box-sizing:border-box;padding:5px 10px;border:1px solid #c8edff;border-radius:8px;background:#102744;color:#fff;font:700 clamp(16px,2.5vw,24px)/1.3 system-ui;text-align:center;overflow-wrap:anywhere;pointer-events:none;}

/* Correct names appear above every falling choice without resizing the prompt. */
.questShowerWrongAnswer.is-answer{left:50%;top:50%;transform:translate(-50%,-50%);z-index:2147483646;width:max-content;max-width:calc(100vw - 32px);padding:12px 20px;border:2px solid #ffe76b;border-radius:14px;background:#102744fa;color:#ffe76b;font-size:clamp(22px,4vw,38px);box-shadow:0 8px 30px #0006;}