:root{--background: #fcf8e3;--foreground: #171717}@media(prefers-color-scheme:dark){:root{--background: #fcf8e3;--foreground: #171717}}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--foreground);background:var(--background)}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}@keyframes shadowPulse{0%,to{transform:scale(1);opacity:.25}50%{transform:scale(.85);opacity:.1}}@keyframes pop-notice{0%{opacity:0;transform:scale(0) rotate(0)}20%{opacity:1;transform:scale(1.3) rotate(15deg)}40%{transform:scale(1) rotate(10deg)}80%{opacity:1;transform:scale(1) rotate(10deg)}to{opacity:0;transform:scale(0) rotate(0)}}@keyframes wave-left{0%{transform:rotate(0)}15%{transform:rotate(-60deg)}35%{transform:rotate(-30deg)}55%{transform:rotate(-50deg)}75%{transform:rotate(-30deg)}to{transform:rotate(0)}}@keyframes wave-right{0%{transform:rotate(0)}15%{transform:rotate(60deg)}35%{transform:rotate(30deg)}55%{transform:rotate(50deg)}75%{transform:rotate(30deg)}to{transform:rotate(0)}}@keyframes pop-bounce{0%{transform:translateY(-50%) scale(0);opacity:0}60%{transform:translateY(-50%) scale(1.05);opacity:1}to{transform:translateY(-50%) scale(1);opacity:1}}.home-container{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100vh;overflow:hidden;-webkit-user-select:none;user-select:none}.logo-area{top:0rem}.logo-img{width:auto;max-width:none;height:0rem;object-fit:contain;transform:scale(.8)}.ghost-area{position:relative;display:flex;flex-direction:column;align-items:center;margin-top:0rem;transition:transform .8s ease-in-out}.ghost-area.is-moved-left{transform:translate(-25vw)}.ghost-tilter{position:relative;display:flex;flex-direction:column;align-items:center;transform-origin:center center;transition:transform .4s ease-in-out}.ghost-tilter.is-tilting{transform:rotate(-15deg)}.ghost-body{position:relative;z-index:10;display:flex;align-items:center;justify-content:center;width:25rem;height:30rem;pointer-events:none;animation:float 3s ease-in-out infinite}.ghost-body:after{position:absolute;top:15%;right:20%;bottom:5%;left:20%;z-index:50;pointer-events:auto;cursor:pointer;content:"";border-radius:40% 40% 30% 30%}.ghost-shadow{position:absolute;bottom:0rem;width:16rem;height:2rem;background-color:#6a7566;border-radius:50%;filter:blur(3px);animation:shadowPulse 3s ease-in-out infinite}.ghost-part{position:absolute;object-fit:contain}img[alt=body]{right:0;bottom:5%;left:0;width:39%;margin:auto}img[alt=head]{top:20%;right:0;left:0;width:44%;margin:auto}#ghost-eye-right{top:32%;left:38%;z-index:20;width:8%}#ghost-eye-left{top:32%;right:33%;z-index:20;width:8%}#ghost-arm-right{top:58%;left:9%;z-index:20;width:17%}#ghost-arm-left{top:58%;right:9%;z-index:20;width:17%}#ghost-eye-left[src*="left_sleep.svg"]{top:35%;right:35%;width:10%}#ghost-eye-right[src*="right_sleep.svg"]{top:35%;left:34%;width:10%}#ghost-eye-left[src*="wakeup.svg"]{top:33%;right:34%;width:12%}.ghost-eye{transition:opacity .3s ease,transform .1s ease-out}.is-looking-right{transform:translate(12px,-2px)!important;transition:transform .4s ease}#ghost-arm-right.is-arms-back{transform:rotate(60deg)!important;transform-origin:80% 20%;transition:transform .4s ease}#ghost-arm-left.is-arms-back{transform:rotate(-60deg)!important;transform-origin:20% 20%;transition:transform .4s ease}#ghost-arm-left.is-presenting-left{transform:rotate(-70deg)!important;transform-origin:20% 20%;transition:transform .5s cubic-bezier(.175,.885,.32,1.275)}.is-waving-left{transform-origin:20% 20%;animation:wave-left 1.2s ease-in-out}.is-waving-right{transform-origin:80% 20%;animation:wave-right 1.2s ease-in-out}.cheek{position:absolute;top:40%;z-index:15;width:10%;height:6%;pointer-events:none;background-color:#ffa2a2;border-radius:50%;opacity:0;filter:blur(12px);transition:opacity .3s ease}.cheek-left{left:30%}.cheek-right{right:30%}.is-blushing .cheek{opacity:.7}.exclamation-mark{position:absolute;top:20%;right:20%;z-index:30;font-size:6rem;font-weight:900;color:#ffa94d;text-shadow:0px 4px 8px rgba(255,255,255,.2);pointer-events:none;opacity:0;transform-origin:bottom left}.is-noticing .exclamation-mark{animation:pop-notice 1s cubic-bezier(.175,.885,.32,1.275) forwards}.btn-area{position:absolute;bottom:5rem}.create-btn{padding:1.25rem 4rem;font-size:2rem;font-weight:700;color:#fff;letter-spacing:.1em;cursor:pointer;background-color:#758e6f;border:none;border-radius:4rem;box-shadow:0 4px 6px #0000001a;transition:transform .1s,background-color .2s}.create-btn:hover{background-color:#5e7359}.create-btn:active{transform:scale(.95)}.status-text{font-size:2rem;font-weight:700;color:#5e7359;transition:opacity .3s ease}.qr-container{position:absolute;top:50%;left:50%;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:90%;max-width:420px;height:60vh;min-height:420px;padding:3rem 0 0;overflow:hidden;background:#fff;border:8px solid #ff9800;border-radius:2.5rem;box-shadow:0 15px 40px #0003;transform:translate(-50%,100vh);transition:transform .6s cubic-bezier(.22,1,.36,1)}.qr-container.is-visible{transform:translate(-50%,-50%)}.qr-text{padding:0 2rem;margin:0 0 2rem;font-size:1.25rem;font-weight:700;color:#5e7359;text-align:center}.qr-mock-box,#qr-code{display:flex;align-items:center;justify-content:center;width:200px;height:200px;font-weight:700;color:#999;background-color:#f0f0f0;border:4px dashed #ccc;border-radius:1rem}.mock-qr-btn{width:100%;padding:1.5rem 1rem;margin-top:auto;font-size:1.15rem;font-weight:700;color:#fff;text-align:center;text-decoration:none;cursor:pointer;background-color:#ff9800;border:none;border-radius:0;box-shadow:none;transition:background-color .2s}.mock-qr-btn:hover{background-color:#e68a00}.mock-qr-btn:active{background-color:#cc7a00;transform:none}.upload-form-area{position:absolute;top:50%;right:8vw;z-index:40;display:flex;flex-direction:column;gap:1.5rem;align-items:center;width:90%;max-width:380px;padding:2.5rem 2rem;background:#fff;border:4px dashed #758e6f;border-radius:2rem;box-shadow:0 10px 30px #0000001a;opacity:0;transform:translateY(-50%) scale(0)}.upload-form-area.is-visible{animation:pop-bounce .6s cubic-bezier(.175,.885,.32,1.275) forwards}.file-input-box{width:100%;padding:1rem;font-size:1rem;border:2px solid #ccc;border-radius:1rem}.zzz-container{position:absolute;top:5%;right:20%;z-index:30;display:flex;flex-direction:column;align-items:flex-end;pointer-events:none}.zzz-text{font-weight:700;line-height:.7;color:#5e7359cc;opacity:0}@keyframes float-zzz{0%{transform:translate(0) translateY(0) scale(.5) rotate(-10deg);opacity:0}20%{opacity:1}to{transform:translate(40px) translateY(-60px) scale(1.2) rotate(10deg);opacity:0}}.z1{font-size:2.5rem;animation:float-zzz 4s cubic-bezier(.45,.05,.55,.95) infinite}.z2{font-size:3.5rem;animation:float-zzz 4s cubic-bezier(.45,.05,.55,.95) infinite;animation-delay:1.3s}.z3{font-size:3rem;animation:float-zzz 4s cubic-bezier(.45,.05,.55,.95) infinite;animation-delay:2.6s}@media(min-width:768px){.logo-area{top:6rem}.logo-img{height:12rem}.btn-area{bottom:6rem}.create-btn{font-size:1.875rem}}