body {background: rgb(52,1,64);background: linear-gradient(356deg, rgba(52,1,64,1) 0%, rgba(3,62,140,1) 71%, rgba(4,85,191,1) 100%);font-family: Georgia, serif;}
html, body {height:100%;overflow:hidden;padding: 0; margin: 0;overflow: hidden;            -webkit-touch-callout: none;            -webkit-user-select: none;            -khtml-user-select: none;            -moz-user-select: none;          -ms-user-select: none; user-select: none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
button {outline:none;}

#main {display:flex;width:100%;height:100%;align-items:center;justify-content:center;}
.content {background:#fff;padding:20px;height:80%;max-height:1000px;width:700px;z-index: 99;-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;overflow:hidden;position:relative;}
#text {height:calc(100% - 128px);display:flex;align-items: center;justify-content: center;font-size:18px;background:#fff;overflow-y:auto;line-height: 1.6;}
.text-off {font-size: 0px !important;}
.buttons {width:100%;display:flex;gap:10px;margin-top:16px;}
#copy {width:100%;}

#copy,#prev,#next,.btn {align-items:center; appearance:none; background-image:radial-gradient(100% 100% at 100% 0,#5adaff 0,#5468ff 100%); border:0; border-radius:6px; box-shadow:rgba(45,35,66,.4) 0 2px 4px,rgba(45,35,66,.3) 0 7px 13px -3px,rgba(58,65,111,.5) 0 -3px 0 inset; box-sizing:border-box; color:#fff; cursor:pointer; display:inline-flex; height:48px; justify-content:center; line-height:1; list-style:none; overflow:hidden; padding-left:16px; padding-right:16px; position:relative; text-align:left; text-decoration:none; transition:box-shadow .15s,transform .15s; user-select:none; -webkit-user-select:none; touch-action:manipulation; white-space:nowrap; will-change:box-shadow,transform; font-size:18px;}
#copy:active,#prev:active ,#next:active,.btn:active,.btn-active {box-shadow: #3c4fe0 0 3px 7px inset;transform: translateY(2px);}
#copy:focus {background-image: radial-gradient(100% 100% at 100% 0, #ff5a5a 0, #5473ff 100%);}
#prev,#next {display:flex;gap:12px;width:300px;}
button svg {overflow:visible;}

#copy {gap:5px;}

.snowball-box .snow-layer .snowball-wrap {display:none !important;}

.topButtons {width:100%;display:flex;gap:10px;margin-bottom:16px;}
.btn {width:100%;height: 48px;min-height: 48px;gap:5px;}
.btn-active { pointer-events: none;opacity: 0.9; }


#game {background:#fff;position:absolute;padding:0px 20px 20px;top:100px;left:0;right:0;bottom:0;display:none;z-index:110;gap:16px;flex-direction: column;}
.game-active {display:flex !important;}

.title {width:100%;font-weight: 700;text-align: center;font-size: 24px;}
.tree {width:100%;height:100%;align-items: center;justify-content: center;display: flex;overflow:hidden;max-height:calc(100% - 106px);}
.tree img {max-height: 100%;}
.desc {width:100%;text-align: center;}

#toy {display:none;}
.toy {position:absolute;top:100px;left:50px;z-index:100;background:none;border:none;}
#toys {position: absolute;top: 80px;left: 0;width: 100%; height: calc(100% - 160px);z-index:105;}

.btnGameEffect {animation: change-size-text;animation-duration: 0.5s;}
@keyframes change-size-text {
  from {
	transform: scale(1);
  }
  50% {
    	transform: scale(0.8);
  }
  to {
   	transform: scale(1);
  }
}

.loading {pointer-events:none;position:absolute;top:49%;left:0;width:100%;height:100%;z-index:10;font-size:20px;color:#fff;text-align: center;}

#main {visibility: hidden;}
.done {visibility: visible !important;}


@media screen and (max-width:800px) {
	.content {width:calc(100% - 4rem);height:calc(100% - 4rem);}
	#prev,#next {font-size: 0px;width:64px;gap:0;}
	.topButtons button {font-size:16px;}
	#text {font-size:16px;line-height: 1.4;}
}