/* F406: 임무판의 배치(자리·크기·보임)는 a44-desktop.css(PC) · a47-mobile.css(폰) 에 — 여기엔 꼴(색·테두리·글)만 */
body #missions{background:var(--ui-hud-a45-missions-missions-background);border:1px solid var(--ui-hud-a45-missions-missions-border);border-radius:12px;color:var(--ui-hud-a45-missions-missions-text);overflow:hidden;box-shadow:0 3px 12px var(--ui-hud-a45-missions-missions-shadow)}
body #missions .missions-heading{display:flex;align-items:center;gap:8px;padding:4px 6px}
body #missions .missions-heading button{border:0;border-image:none;background:none;color:inherit;padding:6px;font-size:12px;min-height:44px;text-align:left;border-radius:6px}
body #missions-toggle{flex:1;font-weight:650}
body #missions-list{max-height:200px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:0 7px 7px}
body #missions-list[hidden]{display:none}
body #missions-list .mission-row{display:block;width:100%;border:0;border-top:1px solid var(--ui-hud-a45-missions-missions-list-mission-row-border-top);border-image:none;border-radius:0;background:none;color:inherit;text-align:left;padding:8px 5px}
body #missions-list .mission-row strong{font-size:13px;line-height:1.4;color:var(--ui-hud-a45-missions-missions-list-mission-row-text)}
body #missions-list .mission-row span{display:block;font-size:11px;line-height:1.5;margin-top:3px;color:var(--ui-hud-a45-missions-missions-list-mission-row-text-2)}
body #missions :is(.mission-resume,.mission-row)>span>span,body #missions .mission-resume>span{display:inline;font-size:inherit;color:inherit;margin:0}
body #missions .mission-name{white-space:nowrap}
body #missions-list .mission-row.ready strong{color:var(--c-success-a45-missions-missions-list-mission-row-ready-text)}
body #missions-list p{font-size:12px;line-height:1.5;margin:6px}
body #missions:not([hidden]):has(.mission-resume){flex-direction:column}
body #missions .mission-resume{font-size:12px;line-height:1.5;margin:0;padding:5px 10px;border-bottom:1px solid var(--ui-hud-a45-missions-missions-mission-resume-border-bottom);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ui-hud-a45-missions-missions-mission-resume-text);flex-shrink:0}
body #missions .mission-resume[hidden]{display:none}
body.missions-visible #alerts{top:var(--missions-bottom,240px)}
body.desktop-ui #missions-list{max-height:min(36dvh,360px)}
body.desktop-ui #missions .missions-heading button{font-size:15px;min-height:36px}
body.desktop-ui #missions-list .mission-row strong{font-size:15px}
body.desktop-ui #missions-list .mission-row span{font-size:13px}
body.desktop-ui #interact{white-space:normal;line-height:1.4}
body.desktop-ui #boss-hud{top:174px;max-width:calc(100vw - 650px)}
@media(orientation:portrait){body #missions-list{max-height:160px}}
@media(orientation:portrait){body.missions-visible #boss-hud{top:var(--missions-bottom,250px)}body.missions-visible.boss-present #alerts{top:calc(var(--missions-bottom,250px) + 70px)}}
@media(orientation:landscape) and (max-height:550px){body #missions-list{max-height:112px}body #missions-list .mission-row{padding:5px}body #missions-list .mission-row span{margin-top:1px}}
/* F90b: 바람길 어귀 확인표 — 미션 칸 안 · 미션 목록 아래(오른쪽 위 한 덩어리). 미션 목록을 접으면 같이 숨고, 폰에선 한 줄로 접힌 채 시작한다. */
body #path-checklist{border-top:1px solid var(--ui-hud-a45-missions-path-checklist-border-top);padding:0 7px 7px}
body #path-checklist .path-checklist-toggle{display:block;width:100%;border:0;border-image:none;background:none;color:var(--ui-hud-a45-missions-path-checklist-path-checklist-toggle-text);padding:6px 5px;font-size:12px;font-weight:650;min-height:30px;text-align:left;border-radius:6px}
body #path-checklist .path-checklist-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:4px;max-height:150px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
body #path-checklist .path-checklist-items[hidden]{display:none}
body #path-checklist .path-check{min-width:0;border:1px solid var(--ui-hud-a45-missions-path-checklist-path-check-border);border-image:none;border-radius:8px;background:var(--ui-hud-a45-missions-path-checklist-path-check-background);color:var(--ui-hud-a45-missions-path-checklist-path-check-text);font-size:11px;line-height:1.3;padding:4px 6px;text-align:left}
body #path-checklist .path-check.done{color:var(--c-success-a45-missions-path-checklist-path-check-done-text);background:var(--ui-hud-a45-missions-path-checklist-path-check-done-background)}
body.desktop-ui #path-checklist .path-checklist-toggle{font-size:15px;min-height:36px}
body.desktop-ui #path-checklist .path-check{font-size:13px;padding:6px 8px}
body:not(.desktop-ui) #path-checklist .path-checklist-toggle,body:not(.desktop-ui) #path-checklist .path-check{min-height:44px}
/* F96: 폰 세로에서 확인표를 펼치면 캐릭터 오른쪽을 덜 가리게 — 미션 목록은 한 줄 높이로 줄이고, 확인 칸은 옆으로 넘기는 한 줄로. */
@media(orientation:portrait){body:not(.desktop-ui) #missions:has(#path-checklist:not([hidden]) .path-checklist-items:not([hidden])) #missions-list{max-height:44px}body:not(.desktop-ui) #path-checklist .path-checklist-items{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:max-content;max-height:none;overflow-x:auto;overflow-y:hidden}}
@media(orientation:landscape) and (max-height:550px){body:not(.desktop-ui) #path-checklist .path-checklist-items{max-height:48px}}
body #tutorial-replay-note{margin:-4px 6px 0;font-size:12px;line-height:1.5;opacity:.85}
/* F96: 320×568 에서 옵션 창의 다시 보기 한 줄이 스크롤 없이 보이게 — 낮은 화면에서 옵션 창 틈만 줄인다. */
@media(max-height:600px){body:not(.desktop-ui) #options-panel{padding:10px 16px}body:not(.desktop-ui) #options-panel .options-group{gap:6px}body:not(.desktop-ui) #options-panel .volume-control{padding:4px 8px;gap:4px}}
/* A354: reserve the existing quick-item lane on short landscape screens. */
@media (orientation:landscape) and (max-height:550px){
 html body:not(.desktop-ui) #missions .missions-heading{flex-shrink:0}
 html body:not(.desktop-ui) #missions .mission-resume{min-height:44px;box-sizing:border-box}
 html body:not(.desktop-ui) #missions #missions-list{min-height:0;flex-shrink:1}
 html body:not(.desktop-ui) #missions-list .mission-row{min-height:44px}
}
/* F349: 넓은 화면(PC 1280×720 등)의 「이어서」 줄 — 한 줄 말줄임 대신 두 줄까지, 넘치면 둘째 줄 끝 …. 폰·가로 폰(A354·A362)은 그대로. */
@media(min-width:900px) and (min-height:551px){body #missions .mission-resume{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;text-overflow:clip}}
/* F476: 미션 칸 줄마다 「길 안내」 단추 — 줄(.mission-row)과 단추(.mission-track)는 형제(.mission-item), 단추는 줄 오른쪽 위에 겹쳐 놓고 줄 안 ::before(같은 글 · 같은 크기, 안 보임)가 제목 줄만 비켜 가게 함. 색은 미션 칸(어두운 초록) 토큰 — 바탕 비침 · 크림 글, 켜짐은 민트(F477, 퀘스트 창 흰 단추 F475 는 그대로). */
body #missions-list .mission-item{position:relative}
body #missions-list .mission-row[data-track-label]::before{content:attr(data-track-label);float:right;visibility:hidden;box-sizing:border-box;margin:0 0 0 4px;padding:3px 7px;min-height:28px;border:1px solid;font-size:calc(var(--readable-font-size) * .8);line-height:1.25;font-weight:650;white-space:nowrap}
body #missions #missions-list .mission-track{position:absolute;top:3px;right:0;box-sizing:border-box;margin:0;padding:3px 7px;min-width:0;min-height:28px;border:1px solid var(--ui-hud-a45-missions-mission-track-border);border-image:none;border-radius:8px;background:var(--ui-hud-a45-missions-mission-track-background);color:var(--ui-hud-a45-missions-mission-track-text);box-shadow:none;text-shadow:none;font-size:calc(var(--readable-font-size) * .8)!important;line-height:1.25;font-weight:650;white-space:nowrap}
body #missions #missions-list .mission-track.active{background:var(--ui-hud-a45-missions-mission-track-active-background);border-color:var(--ui-hud-a45-missions-mission-track-active-border);color:var(--ui-hud-a45-missions-mission-track-active-text)}
