body{margin:0;padding:0;background:#ffe;font-size:14px;font-family:'Segoe UI','Helvetica Neue',Verdana,sans-serif;color:#231F20;overflow:auto}
a {color:#000;font-size:14px;}
#main{width:100%;}
#wrap{position:relative;margin:0 auto;width:1100px;height:680px;margin-top:10px;}
#text{width:340px;
height:560px;
left:150px;
top:70px;position:absolute;
}
#code{display:none;font-size:16px;line-height:1.4;}
#clock-box {position:absolute;left:60px;top:550px;font-size:28px;display:none;}
#clock-box a {font-size:28px;text-decoration:none;}
#clock{margin-left:48px;}
#clock .digit {font-size:64px;}
#canvas{margin:0 auto;width:1100px;height:680px;}
#error{margin:0 auto;text-align:center;margin-top:60px;display:none;}
.hand{cursor:pointer;}
/* Laptop-only gate: phones/tablets/small screens get the starting screen + a note, nothing else. */
#laptop-note{display:none;}
html.gated,html.gated body{overflow:hidden;}
html.gated #main{position:absolute;top:0;left:50%;width:1100px;transform-origin:top center;}
html.gated #clock-box{display:none !important;}
html.gated #canvas{pointer-events:none;}
html.gated #laptop-note{display:block;position:absolute;left:0;right:0;padding:0 24px;text-align:center;}
#laptop-note .big{display:block;font-size:30px;font-weight:700;margin-bottom:12px;}
#laptop-note .small{display:block;font-size:15px;line-height:1.5;color:#777;max-width:440px;margin:0 auto;}
.say{margin-left:5px;}
.space{margin-right:150px;}