body{margin:0;font-family:system-ui,sans-serif;background:#0b3d5c;color:#fff;display:flex;flex-direction:column;align-items:center}
header{display:flex;gap:1em;align-items:center;padding:.5em}h1{margin:0;color:#ffe14d}
main{width:min(720px,95vw)}#frame{aspect-ratio:16/9;background:#000;border-radius:8px;overflow:hidden}#img{width:100%;height:100%;object-fit:contain}
#dots{display:flex;gap:6px;margin:8px 0}#dots button{width:36px;height:28px;border:0;border-radius:4px;background:#345;color:#fff}#dots button.on{background:#ffe14d;color:#000}#dots button:disabled{opacity:.35}
form{display:flex;gap:6px}.ac{position:relative;flex:1}#guess{width:100%;box-sizing:border-box;padding:10px;font-size:16px}
#sugg{position:absolute;bottom:100%;left:0;right:0;margin:0;padding:0;list-style:none;background:#fff;color:#000;max-height:240px;overflow:auto;z-index:2}
#sugg li{padding:6px 10px;cursor:pointer}#sugg li.sel,#sugg li:hover{background:#ffe14d}
button{padding:10px 14px;font-size:15px;cursor:pointer}#history li{margin:3px 0}
#result{background:#134;padding:1em;border-radius:8px;margin-top:1em}#result img{max-width:100%}
.ad{margin:1.5em;width:min(728px,95vw);height:90px;border:2px dashed #789;display:flex;align-items:center;justify-content:center;color:#9ab}
footer{font-size:12px;color:#9ab;padding:1em}footer a{color:#cde}