*{box-sizing:border-box}html,body{height:100%;margin:0}body{font:14px/1.5 Inter,system-ui,sans-serif;color:#19303e;background:#f5f7f9;display:flex;flex-direction:column}header{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 20px;background:#fff;border-bottom:1px solid #dde5e9}header strong{display:block;font-size:17px}header span{font-size:11px;color:#667a87}a{color:#315f7b;text-decoration:none}#expand{white-space:nowrap;font-size:12px}#stage{position:relative;flex:1;min-height:430px;background:#fff;overflow:hidden}iframe{width:100%;height:100%;border:0;display:block;background:white}#loading{position:absolute;inset:0;display:grid;place-items:center;background:#f7f9fa;z-index:2;margin:0}#loading[hidden]{display:none}footer{padding:16px 22px;background:#fff;border-top:1px solid #dce5ea}.caption{display:flex;gap:14px;align-items:baseline;min-height:50px}.caption p{margin:0 0 13px;font-size:16px;max-width:950px}#count{font-size:12px;color:#637882;white-space:nowrap}.controls{display:flex;gap:8px;flex-wrap:wrap}button{font:inherit;padding:10px 16px;border:1px solid #c8d6df;background:white;color:#244b61;border-radius:24px;cursor:pointer}#play{background:#315f7b;color:white}button:disabled{opacity:.5;cursor:default}:focus-visible{outline:3px solid #4a85ab;outline-offset:3px}.note{font-size:11px;color:#667b87;line-height:1.6;margin:12px 0 0}body.embedded #back{display:none}@media(max-width:600px){header{padding:12px;gap:10px}header strong{font-size:15px}header span{font-size:10px}#expand{font-size:11px}#stage{min-height:440px}footer{padding:12px}.caption p{font-size:14px}.controls{gap:5px}button{font-size:12px;padding:9px 11px}.note{font-size:10px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
