:root{color-scheme:light;--ink:#443c3b;--muted:#8b7d79;--accent:#955f64;--heart:#bd8b83}
*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);background:#faf9f6}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}.login-page{min-height:100svh;position:relative;isolation:isolate}.login-atmosphere{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:-1}.login-atmosphere:before,.login-atmosphere:after{content:"";position:absolute;width:75vw;height:85vh;border-radius:50%;filter:blur(30px);animation:breathe 8s ease-in-out infinite alternate}.login-atmosphere:before{left:-25%;top:-12%;background:radial-gradient(ellipse,#edd8d75e,transparent 65%)}.login-atmosphere:after{right:-25%;bottom:-15%;background:radial-gradient(ellipse,#f0dfcd75,transparent 65%);animation-delay:-8s}.login-brand{max-width:810px;margin:auto;padding:38px 36px;font-size:14px;font-weight:500;display:flex;gap:9px;align-items:center}.login-brand span{font-size:21px;color:var(--accent)}.login-layout{max-width:810px;margin:auto;min-height:calc(100svh - 135px);padding:0 36px 65px;display:flex;align-items:center;justify-content:center;gap:68px}.login-artwork{position:relative;flex:0 0 370px;height:290px}.login-book{width:296px;height:204px;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);filter:drop-shadow(0 18px 18px #443c3b12);perspective:900px}.book-page{position:absolute;right:0;width:148px;height:200px;background:#fffdf8;border:1px solid #d9c8bf55;border-radius:7px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;color:var(--heart)}.book-page span,.book-cover span{font-size:32px;font-weight:200}.book-page svg{width:55px;height:38px}.book-cover{position:absolute;left:0;width:148px;height:204px;border-radius:9px 3px 3px 9px;background:linear-gradient(135deg,#a06b70,#8e5b61);display:flex;justify-content:center;padding-top:27px;color:#fffdf8cf}.book-ribbon{position:absolute;right:42px;top:198px;width:8px;height:38px;border-radius:0 0 3px 3px;background:#a27870;z-index:-1}.login-couple{position:absolute;left:-4px;top:67px;width:230px;height:154px;object-fit:contain}.login-form{width:300px;flex:0 0 300px;animation:enter .65s ease-out}.login-form h1{display:table;margin:0 0 24px;padding-bottom:10px;border-bottom:2px solid var(--accent);font-size:14px;font-weight:500;color:var(--accent)}.login-form input[type=password]{display:block;width:100%;height:48px;border:1px solid #d8ccc5;border-radius:10px;background:#ffffffa6;color:var(--ink);padding:0 16px;font-size:16px;outline:none;transition:border-color .2s,box-shadow .2s}.login-form input::placeholder{color:#9c8d87;font-size:14px}.login-form input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #955f6410}.login-submit{width:100%;height:44px;border:0;border-radius:10px;background:var(--accent);color:white;font-size:14px;margin-top:14px;cursor:pointer;transition:transform .15s,background .15s}.login-submit:hover{background:#845057}.login-submit:active{transform:scale(.98)}.login-submit:disabled{opacity:.65;cursor:default}.login-error,.login-note{font-size:12px;line-height:1.7;margin:14px 0 0;color:var(--accent)}.login-note{color:var(--muted)}.has-error input{animation:shake .38s ease-in-out}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.arrival-scene{height:100svh;position:relative;overflow:hidden;background:linear-gradient(#ffffff88,#f6e4d952);animation:arrival-fade 3s both}.arrival-glow{position:absolute;inset:0;background:radial-gradient(ellipse at center,#f8dfc250,transparent 60%)}.arrival-scene .login-book{animation:book-position 2.2s both}.arrival-scene .book-cover{left:148px;transform-origin:left;animation:book-open 1.3s .85s both;border-radius:3px 9px 9px 3px;backface-visibility:visible}.arrival-light{position:absolute;top:calc(50% - 36px);left:calc(50% - 4px);width:8px;height:8px;border-radius:50%;background:var(--heart);box-shadow:0 0 23px 10px #bd8b8333;animation:light-join 1.3s both}.light-left{--from:-132px;--to:-5px}.light-right{--from:132px;--to:5px;background:#c49a62}.arrival-skip{position:fixed;right:30px;top:30px;color:var(--muted);font-size:13px;text-decoration:none;padding:10px}
@keyframes breathe{to{transform:translateY(55px)}}@keyframes enter{from{opacity:0;transform:translateY(12px)}}@keyframes shake{20%,60%{transform:translateX(5px)}40%,80%{transform:translateX(-5px)}}@keyframes book-open{from{transform:rotateY(0)}to{transform:rotateY(-166deg)}}@keyframes book-position{0%{opacity:0;transform:translate(calc(-50% - 65px),-50%) scale(.72)}30%{opacity:1;transform:translate(calc(-50% - 65px),-50%) scale(.8)}100%{transform:translate(-50%,-50%) scale(.8)}}@keyframes light-join{0%{opacity:0;transform:translate(var(--from),0)}20%{opacity:1}75%{opacity:1;transform:translate(var(--to),-45px)}100%{opacity:0;transform:translate(var(--to),-45px)}}@keyframes arrival-fade{0%{opacity:0}20%,78%{opacity:1}100%{opacity:0}}
@media(max-width:700px){.login-brand{padding:25px 26px}.login-layout{min-height:auto;flex-direction:column;gap:16px;padding:24px 26px 55px}.login-artwork{flex-basis:auto;width:330px;max-width:100%;height:245px;transform:scale(.9)}.login-couple{left:-24px;top:44px}.login-form{flex-basis:auto;width:min(100%,320px)}.login-book{max-width:296px}.login-form h1{margin-bottom:22px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.arrival-scene .book-cover{transform:rotateY(-166deg)}.arrival-light{display:none}}
.login-music-toggle{position:fixed;top:29px;right:28px;padding:10px;background:none;border:0;color:var(--muted);font-size:12px;cursor:pointer;z-index:6}.login-music-error{position:fixed;right:28px;top:62px;max-width:230px;margin:0;color:var(--accent);font-size:12px;z-index:6}
@media(max-width:700px){.login-music-toggle{top:20px}}
