*{box-sizing:border-box}body{margin:0;background:#102c32;color:#f7f3df;font-family:system-ui,sans-serif}main{max-width:1120px;margin:auto;padding:24px}header{display:flex;align-items:center;justify-content:space-between;padding:0 0 22px;gap:12px}header a{color:inherit;text-decoration:none;font-size:20px}header b{letter-spacing:-1px}header b span{color:#ff8767}header>div{font-size:11px;letter-spacing:3px;color:#b8d0c8}button{font:inherit;cursor:pointer;border:0}header button{background:#23464a;color:#d3e7de;padding:10px 14px;border-radius:9px;font-size:12px}.frame{position:relative;overflow:hidden;border-radius:18px;box-shadow:0 20px 60px #041b2260;border:1px solid #ffffff20}canvas{display:block;width:100%;aspect-ratio:16/9;background:#a1d3c3}#overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:linear-gradient(90deg,#123d46dc,#123d4670);padding:20px}#overlay.hidden{display:none}.eyebrow{font-size:10px;letter-spacing:3px;color:#f9d489}h1{font-size:clamp(32px,6.7vw,78px);letter-spacing:-3px;line-height:.98;margin:20px 0}#message{font-size:clamp(12px,1.6vw,17px);line-height:1.7;color:#e0ede2;margin:0 0 22px}#start{background:#ffd38c;color:#193e42;padding:15px 30px;font-weight:800;border-radius:11px;box-shadow:0 5px 0 #b98949}.hint{font-size:11px;color:#c5dcd2;margin:23px 0 0}.below{display:flex;justify-content:space-between;gap:15px;font-size:12px;color:#a5c8bb;margin-top:20px}.note{text-align:center;font-size:11px;color:#6f9e95;margin-top:28px}.touch{display:none;justify-content:space-between;margin-top:20px;touch-action:none}.touch>div{display:flex;gap:12px}.touch button{width:64px;height:58px;border-radius:15px;color:#ffdc9d;background:#284e50;font-size:26px;user-select:none;-webkit-user-select:none}.touch button:active{background:#40756c}button:focus-visible,a:focus-visible{outline:3px solid #fff1b6;outline-offset:4px}@media(pointer:coarse){.touch{display:flex}}@media(max-width:600px){main{padding:12px}header>div{display:none}.below{font-size:10px}.eyebrow{font-size:8px;letter-spacing:1px}h1{margin:10px 0;letter-spacing:-1px}#message{margin-bottom:10px}#start{padding:10px 20px}.hint{font-size:8px;margin-top:14px}.note{margin-top:20px}}