#mobileNotes{display:none}
@media(max-width:760px) and (orientation:portrait){
 body{grid-template-rows:auto minmax(0,1fr) auto}
 main{width:100%;height:auto;aspect-ratio:16/9;align-self:start}
 #mobileNotes{display:block;overflow-y:auto;padding:18px 20px 14px;background:#fbfaf8;color:#202027;overscroll-behavior:contain}
 #mobileNotes h2{margin:0 0 12px;font-size:24px;line-height:1.15;letter-spacing:-.55px}
 #mobileNotes ul{padding-left:19px;margin:0 0 18px}
 #mobileNotes li{font-size:16px;line-height:1.45;margin:5px 0}
 #mobileNotes li::marker{color:#9e2f77}
 #thread{display:flex;flex-direction:column;gap:8px}
 #thread p{margin:0;max-width:93%;padding:9px 13px;border-radius:15px;background:#e9e7eb;font-size:16px;line-height:1.35}
 #thread p.shop{align-self:flex-end;background:#e9effa}
 #thread p[hidden]{display:none}
 #thread small{display:block;color:#534956;margin-bottom:3px;font-size:12px;font-weight:650}
 footer{display:grid;grid-template-columns:1fr auto;padding:9px 12px max(10px,env(safe-area-inset-bottom));gap:7px}
 footer label:only-of-type{min-width:0}select{width:100%;max-width:none}
 footer .tools{grid-column:1/-1;display:flex}button,select{min-height:44px;font-size:14px}#next{flex:1}
 footer:has(#costlink[hidden]) label{grid-column:1/-1}
 .inspect{position:fixed;bottom:126px;z-index:6}
}
@media(max-height:500px) and (orientation:landscape){footer{padding:3px 12px}footer .hint{display:none}button,select{min-height:36px}}
#movie{width:100%;height:100%;display:block;background:#101016}
.hotspot{position:absolute;min-height:0;padding:0;border:0;background:transparent;border-radius:12px}