*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#f8f2f5;color:#65576e;font-family:Microsoft YaHei,微软雅黑,sans-serif;font-weight:700;overscroll-behavior:none}#app,#game{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;height:100dvh;margin:0;padding:0;overflow:hidden}#game{touch-action:none}canvas{display:block}header{display:none}button{font-family:inherit;font-weight:700;border:1px solid #cfc2d8;border-radius:20px;background:#fff8efbf;color:#65576e;padding:5px 12px;font-size:12px;cursor:pointer}#rotate{display:none}@media(orientation:portrait)and (max-width:700px){#rotate{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;background:#eee8f2;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;font-size:44px}#rotate strong{font-size:22px}#rotate span{font-size:13px}}.opening{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;display:grid;place-items:center;touch-action:none;backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px);background:#f9e7f32e}.opening-card{position:relative;display:flex;align-items:center;gap:clamp(12px,2vw,28px);width:min(760px,89vw);min-height:clamp(132px,29vh,200px);padding:clamp(20px,4vh,36px) clamp(26px,4vw,52px);border:2px solid #dec4d8;border-radius:38px 46px 35px 48px;background:radial-gradient(ellipse at 0 100%,#efcee3,transparent 44%),radial-gradient(ellipse at 98% 0,#e0cde9,transparent 40%),#fff9eb;box-shadow:inset 0 0 0 5px #fffbf2,0 10px 34px #68537138;color:#574258;font-family:Microsoft YaHei,微软雅黑,sans-serif;font-size:clamp(18px,2.4vw,29px);line-height:1.65}.opening-card:before{content:"";position:absolute;top:9px;right:9px;bottom:9px;left:9px;border:1px dashed #cca8c1;border-radius:30px 38px 27px 40px;pointer-events:none}.opening-card:after{content:"";position:absolute;right:28px;top:-12px;width:48px;height:39px;background:radial-gradient(circle at 50% 50%,#f8d98a 0 12%,transparent 14%),radial-gradient(ellipse at 50% 24%,#e7a9c7 0 21%,transparent 23%),radial-gradient(ellipse at 25% 55%,#edbed4 0 22%,transparent 24%),radial-gradient(ellipse at 70% 60%,#d7aed9 0 23%,transparent 25%),radial-gradient(ellipse at 44% 79%,#e3b1d0 0 19%,transparent 21%);transform:rotate(16deg);pointer-events:none}.opening-card span{font-weight:700;opacity:0;transition:opacity .3s ease}.opening-card span.visible{opacity:1}.opening-card canvas{transform:translate(clamp(8px,1.5vw,18px)) scale(1.38);pointer-events:none;width:clamp(76px,12vw,135px);height:clamp(80px,23vh,140px);object-fit:contain}.opening-card span{flex:1;text-align:center;text-wrap:balance;transform:translate(clamp(-20px,-1.8vw,-8px))}.opening-start{position:absolute;bottom:12px;right:28px;font-size:12px;font-weight:700;color:#856d91}.music-toggle{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:calc(110px + env(safe-area-inset-bottom));z-index:40;width:38px;height:38px;padding:0;border:1px solid #ded0e6;border-radius:13px;background:#fff9efde;box-shadow:0 2px 10px #78628018;touch-action:manipulation;transition:transform .18s ease,background-color .18s ease;isolation:isolate}.music-toggle img{position:absolute;left:50%;top:50%;width:68px;height:68px;max-width:none;object-fit:contain;transform:translate(-50%,-50%);pointer-events:none;-webkit-user-select:none;user-select:none;opacity:0}.music-toggle[data-muted=false] img[data-state=on],.music-toggle[data-muted=true] img[data-state=off]{opacity:1}.music-toggle:before{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:16px}@media(hover:hover){.music-toggle:hover{background:#fff7f2f2;transform:scale(1.06)}}.music-toggle:active{transform:scale(.94)}.music-toggle:focus-visible{outline:2px solid #a786b7;outline-offset:3px}@media(prefers-reduced-motion:reduce){.music-toggle{transition:none}}