html,body{margin:0;height:100%;overflow:hidden;font-family:system-ui,Arial,sans-serif}#app{position:relative;width:100vw;height:100vh}#c{width:100%;height:100%;display:block}.ui{position:absolute;inset:0;pointer-events:none}.topbar{position:absolute;top:12px;left:12px;right:12px;display:flex;justify-content:space-between}.hint{padding:8px 10px;border-radius:10px;background:#00000073;color:#fff;font-size:12px}.music{pointer-events:auto;padding:10px 12px;border-radius:12px;border:0;cursor:pointer;background:#ffffff2e;color:#fff}.attrib{position:absolute;left:12px;bottom:12px;padding:8px 10px;border-radius:10px;background:#00000073;color:#fff;font-size:12px}.modal{position:absolute;inset:0;background:#0000008c;display:grid;place-items:center;pointer-events:auto}.modal.hidden{display:none}.modal-content{position:relative;width:min(680px,94vw);background:#99774a;padding:22px;border-radius:20px}.close{position:absolute;top:10px;right:10px;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:22px;line-height:1;border:0;cursor:pointer;background:#0000000f}.close:hover{background:#0000001a}