/* 문항 레이아웃을 밀지 않는 상위 레이어. 행/아이콘/글자를 한 규격으로 맞춘다. */
.quiz-screen #app .display-controls .question-menu, .question-menu {
  position:fixed; inset:auto; top:var(--menu-top,8px); left:var(--menu-left,8px); margin:0;
  width:320px; max-width:calc(100vw - 16px); max-height:calc(100dvh - var(--menu-top,8px) - 8px); padding:0; align-items:stretch; gap:0;
  border:1px solid var(--line); border-radius:16px; background:var(--surface); color:var(--text);
  box-shadow:0 10px 36px #0003; overflow:hidden;
}
.quiz-screen #app .display-controls .question-menu:not([open]), .question-menu:not([open]) { display:none; }
.quiz-screen #app .display-controls .question-menu[open], .question-menu[open] { display:flex; flex-direction:column; }
.question-menu::backdrop,.question-memo::backdrop {background:#10152566;}
.qm-head {display:flex; flex:none; align-items:center; justify-content:space-between; padding:8px 12px; gap:8px;}
.qm-head h2 {font-size:18px; margin:0;}
.question-menu .qm-close {width:44px; height:44px; min-height:44px; padding:10px; background:transparent;}
.qm-body {min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:0 12px 8px;}
.qm-body section {border-top:1px solid var(--line); padding:8px 0;}
.qm-body h3 {margin:0 0 6px; color:var(--muted); font-size:12px; font-weight:600;}
.question-menu .menu-actions {display:block; padding:0;}
.question-menu .btn.qm-row {display:flex; width:100%; min-height:44px; height:44px; align-items:center; gap:var(--sp-2); padding:8px; border:0; border-radius:8px; background:transparent; text-align:left; font-size:16px; line-height:1.3;}
.question-menu .qm-row[hidden] {display:none;}
.qm-icon {width:20px; height:20px; flex:none; vertical-align:middle;}
.qm-tail {margin-left:auto; color:var(--muted);}
.question-menu [role=menuitemcheckbox].qm-row .qm-tail {font-size:0; width:36px; height:22px; border-radius:20px; background:var(--line); position:relative;}
.question-menu [role=menuitemcheckbox].qm-row .qm-tail::after {content:''; position:absolute; top:3px; left:3px; width:16px; height:16px; border-radius:50%; background:var(--surface);}
.question-menu [role=menuitemcheckbox][aria-checked=true].qm-row .qm-tail {background:var(--primary);}
.question-menu [role=menuitemcheckbox][aria-checked=true].qm-row .qm-tail::after {left:17px;}
.question-menu .rating-options {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--sp-2);}
.question-menu .rating-options button {height:44px; min-height:44px; padding:8px; font-size:16px; line-height:1.3; border:1px solid var(--line); border-radius:8px; background:transparent; color:var(--text); display:flex; align-items:center; gap:var(--sp-2);}
.question-menu .rating-options button[aria-pressed=true] {background:var(--primary-soft); border-color:var(--primary); color:var(--primary);}
.qm-rating-check {margin-left:auto; visibility:hidden;}
[aria-pressed=true]>.qm-rating-check {visibility:visible;}
.question-menu .rating-options .qm-report {grid-column:1/-1; border:0; color:var(--bad); margin-top:2px;}
.question-menu .qm-exit {margin-top:8px;}
.question-menu [data-quit] {color:var(--bad);}
.qm-login,.qm-status {font-size:13px; line-height:1.5; margin:4px 8px; color:var(--muted);}
.qm-login[hidden] {display:none;}
.qm-status {min-height:24px;}
.qm-status:empty {display:block;}
.qm-handle {display:none;}
.question-menu .btn:focus-visible {outline:3px solid var(--primary); outline-offset:-3px;}
.question-memo {width:min(480px,calc(100vw - 24px)); max-height:calc(100dvh - 24px); border:1px solid var(--line); border-radius:16px; background:var(--surface); color:var(--text); padding:16px; overflow-y:auto;}
.question-memo h2 {font-size:20px; margin:0 0 12px;}
.question-memo label {display:grid; gap:8px; font-size:16px;}
.question-memo textarea {width:100%; min-height:100px; font-size:16px; color:var(--text); background:var(--surface); resize:vertical;}
.question-memo [role=status] {font-size:14px; min-height:1.5em;}
.qm-memo-actions {display:flex; flex-wrap:wrap; gap:8px;}
.qm-memo-actions .btn {min-height:44px; font-size:16px;}
@media(max-width:600px) {
  .quiz-screen #app .display-controls .question-menu,.question-menu {top:auto; bottom:0; left:0; width:100%; max-width:100%; max-height:88dvh; border-radius:20px 20px 0 0; padding-bottom:env(safe-area-inset-bottom);}
  .qm-handle {display:block; flex:none; width:36px; height:4px; border-radius:4px; margin:8px auto 0; background:var(--muted);}
}
/* 기존 TV 평가 크기 규칙보다 우선해 메뉴만 16px 규격을 유지한다. */
.quiz-screen #app .question-menu .rating-options button,.tv-mode .question-menu .rating-options button {font-size:16px; padding:8px; min-height:44px; height:44px;}
@media(max-width:600px) {.question-menu .qm-head,.question-menu .qm-handle {touch-action:none;}}

.quiz-screen #app .question-menu .btn.qm-row {font-size:16px;}

.review-page #reviewMenu.question-menu {height:auto; bottom:auto; top:var(--menu-top,8px); left:var(--menu-left,8px); right:auto; width:320px; max-width:calc(100vw - 16px); max-height:calc(100dvh - var(--menu-top,8px) - 8px); margin:0;}
@media(max-width:600px) {.review-page #reviewMenu.question-menu {top:auto; bottom:0; left:0; width:100%; max-width:100%; max-height:88dvh;}}

.qm-memo-privacy {font-size:14px; color:var(--muted); margin:0 0 12px;}
