*{box-sizing:border-box}body{margin:0;background:#10141c;color:#f5f4f0;font:16px system-ui}main{max-width:650px;margin:auto;padding:24px 16px}header{text-align:center}small,span{color:#e9b84b}h1{font-size:2.8rem;margin:6px}section{border:1px solid #354052;border-radius:18px;padding:18px;margin:18px 0;background:#1a202c}input{width:100%;padding:13px;background:#0e121a;color:white;border:1px solid #566174;border-radius:10px;margin:10px 0}button{background:#e9b84b;color:#17191d;border:0;border-radius:10px;padding:13px;margin:4px;font-weight:bold;cursor:pointer}.controls{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.controls button{margin:0}video{width:100%;max-height:320px;background:#080b10;border-radius:10px;transform:scaleX(-1)}.hint{color:#b8c1d1;font-size:.9rem}pre{min-height:5rem;white-space:pre-wrap;overflow-wrap:anywhere}