@import"https://fonts.googleapis.com/css2?family=Nunito:wght@400;600&family=Amiri:wght@400;700&display=swap";*{margin:0;padding:0;box-sizing:border-box;text-decoration:none}:root{--Primary-color: #0e4f77;--h1-size: 1.5rem}body{background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.4),transparent 40%),radial-gradient(circle at 80% 30%,rgba(255,255,255,.3),transparent 40%),linear-gradient(180deg,#b0d0ef,#d4e7f8);background-size:cover;min-height:100vh;overflow:hidden auto;font-family:Nunito,Amiri,-apple-system,sans-serif}.container{padding:3rem 4vw;max-width:1200px;margin:auto;display:flex;flex-direction:column;gap:2.2rem}.card{background-color:#ffffffd9;padding:1.5rem 1rem;border:2px dashed rgb(96 139 168);border-radius:1.2rem;box-shadow:0 4px 15px #608ba81a;overflow:hidden;text-align:center;align-items:center;transition:all .3s ease}.card:hover{transform:translateY(-2px);box-shadow:0 4px 15px #608ba84d}h1{letter-spacing:.5px}header{display:flex;align-items:center;gap:.8rem}header .avatar-wrapper{position:relative}header .avatar{width:5.2rem;border:2px dashed white;border-radius:50%;object-fit:cover;aspect-ratio:1 / 1;transition:scale .3s ease;box-shadow:0 2px 8px #0000001a}header .avatar:hover{scale:1.05}header .ribbon{position:absolute;top:-8px;right:-2px;font-size:1.8rem;rotate:-20deg;-webkit-user-select:none;user-select:none;transition:scale .3s ease}header .ribbon:hover{scale:1.2}header h1{font-size:1.8rem;color:var(--Primary-color)}header p{color:#606060;font-size:1rem;word-wrap:break-wrap}ul{list-style-type:none}#timer{padding-right:3rem;padding-left:3rem}#timer h1{font-size:var(--h1-size);color:var(--Primary-color);margin-bottom:1rem}#timer .timercontainer{display:flex;gap:.8rem;align-items:center;justify-content:center}#timer .smallbox{height:3.5rem;width:calc(33.33% - 20px);border:1.3px dashed rgb(96 139 168);border-radius:.4rem;background-color:#d8f0ff;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:default;-webkit-user-select:none;user-select:none;font-size:1.3rem;transition:scale .3s ease;font-weight:600;box-shadow:0 2px 8px #608ba833}#timer .smallbox:hover{scale:1.03;box-shadow:0 3px 12px #608ba84d}#timer .smallbox span{font-size:.8rem;font-weight:400;color:#606060}#message{display:flex;flex-direction:column;gap:1rem}#message h1{font-size:var(--h1-size);color:var(--Primary-color)}#message .message-container{display:flex;flex-direction:row;gap:1rem;align-items:center;text-align:left}#message .message-container h2{font:1.1rem;color:var(--Primary-color);font-weight:600}#message .message-container small{color:#999;font-weight:400;font-size:.8rem}#message .message-container p{font-size:1.2rem;margin-top:.2rem;word-break:break-word;overflow-wrap:break-word;white-space:normal;text-align:start;unicode-bidi:plaintext}#message .message-container img{width:4.5rem;aspect-ratio:1 / 1;border-radius:50%;border:1px dashed rgb(96 139 168);object-fit:cover;box-shadow:0 2px 8px #608ba833;transition:.3s ease}#message .message-container img:hover{scale:1.05;box-shadow:0 2px 8px #608ba84d}#message #message1{display:flex;flex-direction:row;align-items:flex-start;gap:.75rem;align-self:flex-start}#message #message2{text-align:right;display:flex;flex-direction:row;align-items:flex-start;gap:.75rem;align-self:flex-end}#letter{position:relative;background-color:#f6eee7;padding:.75rem 1.5rem}#letter .greeting{text-align:start;font-size:1.6rem;color:#333}#letter p{white-space:pre-wrap;word-wrap:break-word;text-align:start;font-size:1.2rem;margin:.7rem;color:#555}#letter .closure{text-align:end;font-size:1.3rem}.letter-body{overflow:hidden;transition:max-height .4s ease}.letter-body.collapsed{max-height:8rem}.letter-body.expanded{max-height:9999px}.letter-fade{height:3rem;margin-top:-3rem;background:linear-gradient(to bottom,transparent,#f6eee7);pointer-events:none;position:relative;z-index:1}.letter-toggle{display:block;margin:.5rem auto 0;background:none;border:none;color:#999;font-size:.85rem;cursor:pointer;transition:color .2s}.letter-toggle:hover{color:#555}#drawing-canvas{width:100%;border-radius:.8rem;cursor:crosshair;background:#fff;touch-action:none;display:block}#drawing-toolbar{display:flex;align-items:center;gap:1rem;margin-bottom:.8rem}#drawing-toolbar input[type=color]{width:2.5rem;height:2.5rem;border:none;border-radius:50%;cursor:pointer;padding:0}#drawing-toolbar button{padding:.3rem .8rem;border-radius:.5rem;cursor:pointer;background:linear-gradient(135deg,#6e8eba,#5a74a8);color:#fff;border:1px dashed rgb(255,255,255);box-shadow:0 4px 15px #608ba833;transition:all .3s ease}#drawing-toolbar button:hover{transform:scale(1.02);box-shadow:0 4px 15px #608ba84d}#drawing-toolbar button:active{transform:scale(.95)}#things h1{font-size:var(--h1-size);font-size:1.8rem;color:var(--Primary-color)}#things p{color:#606060;font-size:.95rem;margin-top:.1rem}#things ul{max-height:30rem;overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none;position:relative}#things ul:after{content:"↓ Scroll Down";position:sticky;bottom:10px;font-size:.85rem;color:#999;animation:bounce 2s infinite;pointer-events:none;z-index:10;display:block;text-align:center;width:100%}@keyframes bounce{0%,to{transform:translateY(0);opacity:1}50%{transform:translateY(-8px);opacity:.7}}#things ul[data-scrollable=false]:after{display:none}#things ul::-webkit-scrollbar{display:none}#things li{border:1.3px dashed rgb(96 139 168);border-radius:.8rem;background-color:#d8f0ff;padding:.8rem;margin:.8rem;overflow:hidden;text-align:left;transition:all .3s ease;color:#333;box-shadow:0 3px 12px #608ba81a}#things li:hover{scale:1.02;box-shadow:0 3px 12px #608ba84d}#button{padding:0;background-color:#fff;width:15rem;margin:auto;box-shadow:0 2px 8px #608ba81a;border-radius:1.2rem}#button button{height:3rem;width:100%;font-size:1.3rem;background:linear-gradient(135deg,#6e8eba,#5a74a8);border:none;border-radius:1.2rem;cursor:pointer;color:#fff;font-weight:600;transition:all .3s ease}#button button:hover{transform:scale(1.05);box-shadow:0 4px 12px #113864}#button button:active{transform:scale(.92)}@keyframes burst{0%{transform:translate(0) rotate(0) scale(.5);opacity:0}20%{opacity:.9;scale:1.2}70%{opacity:.8}85%{opacity:.3}to{transform:translate(var(--tx),var(--ty)) rotate(var(--r)) scale(.3);opacity:0}}#badges h1{font-size:var(--h1-size);color:var(--Primary-color)}.badges li{border:1.3px dashed rgb(96 139 168);border-radius:.8rem;background-color:#d8f0ff;padding:.5rem;margin:.8rem;display:flex;gap:1rem;position:relative;cursor:default;transition:all .3s ease;box-shadow:0 3px 12px #608ba81a}.badges li:hover{scale:1.015;box-shadow:0 3px 12px #608ba84d}.badges li img{width:4rem;margin:auto 0;aspect-ratio:1 / 1;border-radius:50%;transition:transform .3s ease}.badges li img:hover{transform:rotate(-5deg) scale(1.05)}.lockedicon{filter:brightness(.75)}.badges .stuff{text-align:left;width:80%;margin:auto 0}.badges li h2{font-size:1.1rem}.badges li p{color:#606060;font-size:.8rem}.progress-bar{height:6px;background:#333;border-radius:5px;overflow:hidden;margin-top:.5rem;width:100%}.progress{height:100%;background:green}.infinity-rain-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden;z-index:10}@keyframes fall{0%{top:-50px}to{top:100vh}}@media screen and (max-width:600px){*{-webkit-user-select:none;user-select:none}header .ribbon{top:-2px;right:-1px}#timer{padding:1.5rem}#timer .timercontainer{flex-wrap:wrap}}