/* 미리보기 전용(앱에는 없음): 위 노란 띠 + '0.1.10에서 바뀐 것' 패널. 앱 화면(body)은 띠 아래로 내림 */
:root{--pvh:44px}
html{background:#fff}
body{position:relative;transform:translateZ(0);margin-top:var(--pvh)!important;height:calc(100% - var(--pvh))!important}
.fi .th:not(.img):after{content:"정지 화면 · 미리보기에선 재생 안 됨"}

#pvStrip{position:fixed;left:0;right:0;top:0;height:var(--pvh);z-index:2147483000;background:#ffe45c;color:#3d3000;border-bottom:1px solid #e0c13a;
  display:flex;align-items:center;gap:14px;padding:0 14px 0 18px;font:600 11.5px/1.35 Pretendard,"Malgun Gothic",sans-serif;box-sizing:border-box;user-select:none}
#pvStrip .t{flex:1;min-width:0}
#pvStrip .t b{font-weight:900}
#pvStrip .t span{display:block;font-weight:500;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#pvStrip .t>div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#pvStrip .as{display:flex;align-items:center;gap:4px;background:#fff8;border-radius:999px;padding:3px}
#pvStrip .as em{font-style:normal;padding:0 6px 0 8px;opacity:.75}
#pvStrip button{font:inherit;border:0;cursor:pointer;border-radius:999px}
#pvStrip .as button{background:transparent;padding:5px 10px;color:#3d3000}
#pvStrip .as button.on{background:#3d3000;color:#ffe45c}
#pvToggle{background:#3d3000;color:#fff;padding:8px 14px;font-weight:800!important}
#pvToggle i{font-style:normal;display:inline-block;transition:.2s;margin-left:6px}
#pvToggle.open i{transform:rotate(180deg)}

#pvPanel{position:fixed;right:14px;top:calc(var(--pvh) + 66px);z-index:2147483001;width:372px;max-height:calc(100vh - var(--pvh) - 80px);overflow-y:auto;
  background:#fff;border:1px solid #e6e6ee;border-radius:18px;box-shadow:0 24px 60px -20px #0006;font:500 12.5px/1.45 Pretendard,"Malgun Gothic",sans-serif;color:#15151c;
  padding:12px 12px 10px;box-sizing:border-box}
#pvPanel[hidden]{display:none}
#pvPanel h4{margin:2px 6px 8px;font-size:13px;font-weight:900;display:flex;justify-content:space-between;align-items:baseline}
#pvPanel h4 small{font-weight:500;color:#888;font-size:11px}
#pvPanel .it{display:block;width:100%;text-align:left;border:0;background:#f6f6f9;border-radius:12px;padding:7px 11px;margin:0 0 5px;cursor:pointer;font:inherit;color:inherit}
#pvPanel .it:hover{background:#fff4c2}
#pvPanel .it b{display:block;font-weight:800;font-size:12.5px}
#pvPanel .it b i{font-style:normal;display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#15151c;color:#fff;font-size:10.5px;margin-right:6px;vertical-align:1px}
#pvPanel .it span{display:block;color:#555;font-size:11.5px;margin-top:2px}
#pvPanel .it span u{text-decoration:none;color:#a06a00;font-weight:700}
#pvPanel .ex{background:#fafafa;border:1px dashed #ddd;border-radius:12px;padding:10px;margin:-2px 0 8px;font-size:11.5px;color:#444}
#pvPanel .ex[hidden]{display:none}
#pvPanel .tray{display:flex;gap:10px;flex-wrap:wrap}
#pvPanel .tm{background:#f3f3f3;border:1px solid #cfcfcf;box-shadow:2px 3px 10px -4px #0005;border-radius:4px;padding:4px 0;min-width:150px;font:12px "Segoe UI","Malgun Gothic",sans-serif;color:#111}
#pvPanel .tm div{padding:4px 22px}
#pvPanel .tm div.hi{background:#cfe3fb}
#pvPanel .tm hr{border:0;border-top:1px solid #d6d6d6;margin:4px 6px}
#pvPanel .tm .cap{font:600 10.5px Pretendard,sans-serif;color:#777;padding:0 8px 4px}
#pvPanel .foot{color:#888;font-size:11px;margin:6px 6px 2px}
#pvPanel .lnk{color:#2f5bd8;cursor:pointer;text-decoration:underline}

.pv-flash{outline:3px solid #ffbf00!important;outline-offset:4px;border-radius:14px;animation:pvf 1s ease-in-out 3}
@keyframes pvf{50%{outline-color:#ffbf0033}}

#pvMd{position:fixed;inset:0;z-index:2147483002;background:#0007;display:grid;place-items:center}
#pvMd[hidden]{display:none}
#pvMd .b{width:min(900px,calc(100vw - 48px));max-height:calc(100vh - 80px);background:#fff;border-radius:18px;display:flex;flex-direction:column;overflow:hidden;font:500 12.5px Pretendard,sans-serif}
#pvMd .h{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid #eee;font-weight:800}
#pvMd .h button{border:0;background:#f2f2f5;border-radius:999px;width:30px;height:30px;cursor:pointer}
#pvMd pre{margin:0;padding:16px 18px;overflow:auto;white-space:pre-wrap;word-break:break-all;font:12px/1.55 Consolas,"D2Coding","Malgun Gothic",monospace;color:#222}