/* Actual touch sizes include the frame scale. Loaded after the DAY stylesheet. */
html, body { overscroll-behavior-y: none; }
.frame--mo { --mo-hud: calc(var(--touch-min) * 2 + 24px); }
.frame--mo .drag, .frame--mo .drag * { touch-action: none; }
.frame--mo :is(button, input, [role="button"]):not(.die2, .in-die, .in-quad) {
  min-width: var(--touch-min); min-height: var(--touch-min);
}
.frame--mo .mhud__row { height: var(--touch-min); }
.frame--mo .mhud__btn { width: var(--touch-min); height: var(--touch-min); }
.frame--mo .mhud__metrics { margin-top: 4px; }
.frame--mo .mmet { padding-top: 2px; padding-bottom: 2px; }
.frame--mo .ws { overflow-y: auto; scroll-padding-block: 12px calc(var(--mo-cta) + 28px); }
.frame--mo .ws__foot { background: var(--paper); border-radius: 14px; }
.frame--mo :is(.ws, .chpage, .trip__choice, .card, .elv-landed, .elv-scold) { overscroll-behavior: contain; }
.frame--mo .mdial__win { min-width: 0; overflow: hidden; }
.chpage:focus-visible { outline: 2px solid var(--volt); outline-offset: -3px; }
.frame--mo .d3pack .ws__foot { z-index: 30; }
.frame--mo .pk-anatomy__substrate > span { display: none; }
.frame--mo .pk-substrate-label { display: block; position: absolute; top: 8px; left: 8px; color: #dff0e7; font: 600 var(--read-min)/1.4 var(--font-body); }
/* 읽을 수 있는 크기를 유지하고 화면을 넘는 내용은 스크롤한다. */
.frame--mo .trip__choice { overflow-y: auto; }
.frame--mo .trip-pick { position: relative; inset: auto; width: auto; margin: 14px; }
.frame--mo .card {
  width: calc(100% - 2 * var(--mo-pad)); max-height: calc(100% - var(--mo-hud) - 24px);
  top: calc((100% + var(--mo-hud)) / 2);
  overflow-y: auto; overflow-wrap: anywhere;
}
.frame--mo .card__head { padding: 16px; gap: 10px; }
.frame--mo .card__body { padding: 16px; gap: 12px; }
.frame--mo .card__body img { height: 80px; }
.frame--mo .card__foot { padding: 0 16px 16px; }
.frame--mo .elv-landed, .frame--mo .elv-scold {
  overflow-y: auto; padding: 14px 14px calc(var(--mo-cta) + 30px);
  display: flex; flex-direction: column; gap: 14px;
}
.frame--mo :is(.elv-nameplate, .elv-brief, .elv-scold__chip, .elv-warnstamp, .elv-scold__row, .elv-scold__say, .elv-remind) {
  position: static; width: auto; margin: 0; flex-shrink: 0;
}
.frame--mo :is(.elv-landed__volti, .elv-scold__volti) { position: relative; inset: auto; margin: 0 auto; flex-shrink: 0; }
.frame--mo .elv-landed__cta { position: fixed; z-index: 3; }
.frame--mo .elv-cta--back { z-index: 3; }
/* 실패 결과를 읽는 동안에는 작업 입력 없이 본문 스크롤만 대사와 함께 허용한다. */
.frame--mo:has(.bm-stage--failed) .d3benchmark { padding-bottom: 210px; }
.frame--mo:has(.bm-stage--failed) .dialog { pointer-events: none; }
.frame--mo:has(.bm-stage--failed) .dialog__line { pointer-events: auto; }
.frame--mo .ws__guide { padding-inline: 10px; text-align: center; animation: none; }
.frame--mo .dies-zoom__btn { min-height: var(--touch-min); }
.dies-view { align-items: flex-start; justify-content: flex-start; }
.dies-wafer { margin: auto; }
.frame--mo .dies-view { overscroll-behavior: contain; scroll-padding: 10px; }
.frame--mo .dayend-quiz__hint { padding: 8px; }
.frame--mo .dayend-quiz__input { font-size: max(16px, var(--read-min)); }
.frame--mo .promo__ok { max-width: none; }
.frame--mo :is(.desk-seat__target, .desk-bank__return, .desk-bank__nav, .desk-run, .bn-submit, .decision-submit) {
  min-height: var(--touch-min); min-width: var(--touch-min);
}
.frame--mo :is(.mpass__close, .notebook__close, .mdial__arrow) {
  width: var(--touch-min); height: var(--touch-min); flex-shrink: 0;
}
.frame--mo .mdial__dots {
  justify-content: flex-start; overflow-x: auto; gap: 6px;
  padding: 3px 1px 6px; touch-action: pan-x; overscroll-behavior-x: contain;
}
.frame--mo .mdial__dot {
  width: var(--touch-min); height: var(--touch-min); flex: 0 0 var(--touch-min);
  border: 1px solid #c9bfa8; border-radius: 10px; color: var(--ink);
  font: 600 15px var(--font-body); cursor: pointer;
}
.frame--mo .mdial__dot--sel { outline: 2px solid var(--ink); outline-offset: -3px; }
.frame--mo .pk-part { height: auto; min-height: 112px; }
.frame--mo .pk-part__term { font-size: var(--read-min); white-space: normal; word-break: keep-all; padding: 0; border: 0; background: none; }
.frame--mo .pk-part__name { font-size: max(14px, var(--read-min)); }
.frame--mo .pk-cutaway { --pk-source-h: 96px; }
.frame--mo .pk-cutaway__package { height: calc(var(--pk-source-h) + 204px); }
.frame--mo .pk-board25 { top: var(--pk-source-h); }
.frame--mo .pk-emc-source { right: 0; width: 100%; height: var(--pk-source-h); padding: 8px calc(50% + 8px) 8px 40px; }
.frame--mo .pk-emc-source > b { display: none; }
.frame--mo .pk-emc-source > span { margin: 0; font-size: var(--read-min); word-break: keep-all; }
.frame--mo .pk-emc-source > .pk-spot { left: 50%; padding: 8px; }
.frame--mo .pk-emc-source > .pk-spot .pk-spot__label { font-size: var(--read-min); max-width: 100%; }
.frame--mo .pk-emc-source > .pk-spot .pk-spot__text { font-size: var(--read-min); }
.frame--mo .pk-resin-nozzle { top: calc(var(--pk-source-h) - 6px); }
.frame--mo .pk-resin-stream { top: calc(var(--pk-source-h) + 18px); }
.frame--mo .pk-spot { min-height: var(--touch-min); }
.frame--mo .elv-panel { max-height: none; }
.frame--mo .dayend__col { overflow-y: auto; padding-bottom: calc(var(--mo-cta) + 30px); }
.frame--short .dayend__volti { display: none; }

/* Same inspected die, with a large alternative input. No unscanned evidence. */
.in-samples { margin-bottom: 12px; }
.frame--pc .in-samples { display: none; }
.in-samples__title { font: 600 14px var(--font-body); margin-bottom: 8px; }
.in-samples__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.in-sample { min-height: 44px; border: 2px solid #bd9620; border-radius: 9px; background: #fff4b8; color: #263452; cursor: pointer; font: 600 13px var(--font-body); }
.in-sample[aria-pressed="true"] { background: #f0c93b; border-color: #263452; }
.in-judge { scroll-margin-block: 12px 90px; }
.frame--mo .in-judge__btn { min-height: var(--touch-min); }
.frame--mo .in-die__q { font-size: 9px; }

/* Tablets use their width. The semantic source -> destination order is retained. */
.frame--wide .ws__body--two { flex-direction: row; align-items: flex-start; gap: 16px; }
.frame--wide .ws__body--two > .ws__col { flex: 1; width: 0; min-width: 0; }
.frame--wide .ws__body--two > .zoneflow { flex: none; flex-direction: column; }
.frame--wide .zoneflow__arrow { rotate: none; }
.frame--wide .role-sort { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); align-items: start; }
.frame--wide .role-card { max-width: 460px; }
.frame--wide .pk-parts { flex-direction: column; }
.frame--wide .pk-part { flex-direction: row; text-align: left; min-height: 76px; gap: 12px; padding: 12px; }
.frame--wide .in-wafer-wrap { --sz: 300px; }
.frame--wide .dies-view { max-height: 360px; }
.frame--wide .notebook--mo { max-width: 860px; margin-inline: auto; }
.frame--wide .mdial__dots { justify-content: center; }
.frame--wide .mission { width: 100%; max-width: 900px; align-self: center; }
.frame--wide .mission__factors { flex-direction: row; }
.frame--wide .mfactor { flex: 1; min-width: 0; }
.frame--wide .ending__body { grid-template-columns: .85fr 1.15fr; }

/* Short landscape screens scroll content, never shrink the whole game. */
.frame--landscape { --mo-hud: 64px; --mo-cta: 48px; }
.frame--landscape .hud--mo { flex-direction: row; align-items: center; gap: 14px; padding: 8px 12px; }
.frame--landscape .mhud__row { flex: 1; min-width: 0; }
.frame--landscape .mhud__metrics { flex: 1; margin: 0; }
.frame--landscape .mhud__crumb { display: none; }
.frame--landscape .ws { padding-top: 8px; padding-bottom: calc(var(--mo-cta) + 28px); }
.frame--landscape .ws__title { font-size: 18px; }
.frame--landscape .ws__body { margin-top: 8px; }
.frame--landscape .home__volti, .frame--landscape .talk__volti { display: none; }
.frame--landscape .home__card { max-height: calc(100% - 100px); overflow-y: auto; }
.frame--landscape .dialog__line { padding: 10px 14px; }
.frame--landscape .dialog__body { font-size: 16px; min-height: 0; max-height: 100px; overflow-y: auto; }
.frame--landscape .dialog__face, .frame--landscape .dialog__avatar { width: 44px; height: 44px; }
.frame--landscape .mission__card { padding: 12px; }
.frame--landscape .mfactor { display: block; }
.frame--landscape .mfactor__note { padding: 8px 11px; }
.frame--landscape .mdial__meta, .frame--landscape .mdial__row { display: none; }
.frame--landscape .mdial { padding: 2px 12px; margin: 0; }
.frame--landscape .notebook--mo .notebook__head { padding-top: 4px; }
.frame--landscape .in-samples__list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.frame--landscape .ws__foot { bottom: 8px; }
.frame--landscape .dayend__col { padding-top: 12px; }
.frame--landscape .dayend__title { font-size: 26px; }
.frame--landscape .dayend-quiz { margin-top: 8px; }
.frame--landscape .elv-hall { flex-direction: row; overflow: hidden; }
.frame--landscape .elv-room { flex: 1; min-width: 0; min-height: 0; }
.frame--landscape .elv-panel { width: 50%; height: 100%; max-height: 100%; margin: 0; overflow-y: auto; overscroll-behavior: contain; }
.frame--landscape .elv-landed { overflow-y: auto; padding: 14px 14px calc(var(--mo-cta) + 30px); display: grid; grid-template-columns: .9fr 1.1fr; gap: 16px; align-content: start; }
.frame--landscape .elv-nameplate, .frame--landscape .elv-brief { position: static; width: auto; margin: 0; }
.frame--landscape .elv-landed__volti, .frame--landscape .elv-scold__volti { display: none; }
.frame--landscape .elv-landed__cta { position: fixed; }
.frame--landscape .elv-scold { overflow-y: auto; padding: 14px 14px calc(var(--mo-cta) + 30px); display: grid; grid-template-columns: 1fr auto; gap: 12px; align-content: start; }
.frame--landscape :is(.elv-scold__chip, .elv-warnstamp, .elv-scold__row, .elv-scold__say, .elv-remind) { position: static; width: auto; }
.frame--landscape :is(.elv-scold__row, .elv-scold__say, .elv-remind) { grid-column: 1 / -1; }
.frame--landscape .elv-cta--back { position: fixed; }
.frame--landscape .clear__col { overflow-y: auto; padding-bottom: calc(var(--mo-cta) + 30px); }
.frame--landscape .clear__volti { display: none; }
.frame--landscape .promo { max-height: 100%; overflow-y: auto; }
.frame--landscape .mpass__head { padding-block: 6px; }

.frame--landscape .overlay--spot :is(.mpass, .notebook--mo) { top: calc(var(--mo-hud) + 10px); right: 40%; bottom: 14px; }
.frame--landscape:has(.overlay--spot) .dialog__line { left: calc(60% + 10px); right: 14px; top: calc(var(--mo-hud) + 10px); bottom: auto; width: auto; }