html{min-height:100%;}
body{margin:0;padding:0;background:#dff5ff;font-size:14px;font-family:"KaiTi","STKaiti","Microsoft YaHei",serif;color:#231F20;overflow-x:hidden;overflow-y:auto;}
a{color:#000;font-size:14px;}
#main{box-sizing:border-box;display:flex;justify-content:center;width:100%;min-height:100vh;padding:max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));position:relative;z-index:1;}
#wrap{position:relative;width:min(1100px,100%);aspect-ratio:1100/680;margin:0 auto;background-position:center top;background-repeat:no-repeat;background-size:100% 100%;}
#text{position:absolute;left:17.09%;top:11.76%;width:24.72%;height:82.35%;overflow:hidden;}
#code{display:none;font-size:clamp(10px,1.45vw,16px);line-height:1.55;}
#clock-box{position:absolute;left:5.45%;top:80.88%;font-size:clamp(14px,2.55vw,28px);display:none;white-space:nowrap;}
#clock-box a{font-size:inherit;text-decoration:none;}
#clock{margin-left:4.36%;}
#clock .digit{font-family:Georgia,"Times New Roman",serif;font-size:clamp(24px,5.8vw,64px);line-height:1;}
#canvas{display:block;width:100%;height:100%;margin:0 auto;}
#error{margin:0 auto;text-align:center;margin-top:60px;display:none;}
.hand{cursor:pointer;}
.say{margin-left:5px;}
.space{margin-right:13.64%;}

@media (max-width:520px){
  #main{align-items:flex-start;padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));}
  #wrap{height:clamp(320px,94vw,450px);aspect-ratio:auto;background-size:100% auto!important;}
  #canvas{width:100%;height:auto;}
  #text{left:8%;top:14px;width:46%;height:auto;overflow:visible;z-index:2;}
  #code{font-size:clamp(10px,2.75vw,11px);line-height:1.34;}
  #clock-box{left:0;top:clamp(210px,65vw,340px);width:100%;font-size:clamp(12px,3.35vw,15px);line-height:1.1;text-align:center;white-space:normal;z-index:3;}
  #clock{display:block;margin:2px 0 0;}
  #clock .digit{font-size:clamp(22px,7vw,30px);}
  .say{margin-left:2px;}
}
