@font-face{font-family:JinyongKai;src:url('../fonts/JinyongKai-Regular.ttf') format('truetype');font-display:block}*{box-sizing:border-box}html,body{height:100%;margin:0;background:#080c11;color:#cfd6df;font:12px/1.5 -apple-system,'PingFang SC',sans-serif}body{display:flex;flex-direction:column}header{display:flex;align-items:center;gap:15px;padding:9px 15px;background:#101722;border-bottom:1px solid #293140;min-height:47px}header strong{font-size:14px;white-space:nowrap}#state{font-size:11px;color:#84939c}nav{display:flex;align-items:center;gap:7px;margin-left:auto}button,a{font:inherit;color:inherit}button{cursor:pointer;background:#1b2737;border:1px solid #34435a;border-radius:4px;padding:4px 10px}button:hover{background:#2b3b50}a{color:#91a7bd;text-decoration:none;padding:3px 5px}main{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:10px}#stage{position:relative;aspect-ratio:5/4;width:min(100%,calc((100vh - 75px)*1.25));max-height:100%;background:#000;box-shadow:0 8px 50px #0009;overflow:hidden}canvas{display:block;width:100%;height:100%;touch-action:manipulation}#inputs{position:absolute;inset:0;pointer-events:none}.movie-input{position:absolute;background:transparent!important;border:0!important;border-radius:0;outline:0;margin:0;padding:0;font-family:JinyongKai,'KaiTi',serif;pointer-events:auto;line-height:1;min-width:0;box-sizing:border-box}#loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0d1420ed;color:#c1cfde;font-size:14px;pointer-events:none}#loading[hidden]{display:none}#message{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#182534ee;border:1px solid #41556a;padding:10px 19px;border-radius:6px;max-width:85vw;z-index:10}dialog{background:#142031;color:#d6e1ed;border:1px solid #41556a;border-radius:8px;width:min(550px,90vw);max-height:85vh;padding:20px}dialog::backdrop{background:#000a}.dialog-title{display:flex;align-items:center;justify-content:space-between}.dialog-title h2{margin:0;font-size:20px}.slot{border:1px solid #3d4a5b;border-radius:5px;margin-top:12px;padding:14px}.slot h3{margin:0 0 8px}.slot p{color:#9aabbc;margin:0 0 10px}.slot button{margin-right:7px}dialog>p{font-size:11px;color:#90a3b6;margin-bottom:0}@media(max-width:740px){header{flex-wrap:wrap;gap:4px;padding:8px 10px}header strong{font-size:12px}#state{margin-left:auto}nav{margin-left:0;gap:6px;width:100%;justify-content:flex-end}nav button,nav a{font-size:11px;padding:4px 7px}main{padding:3px}#stage{width:100%;max-height:none}body{height:100dvh}canvas{image-rendering:auto}}
