
:root{color-scheme:dark;--gold:#e5c588;--muted:#a6ada5;--line:#b3a67838}*{box-sizing:border-box}body{margin:0;background:#081419;color:#f1e4ca;font-family:"Microsoft Yahei","PingFang SC",sans-serif}button,input,select{font:inherit}button{cursor:pointer;color:inherit;border:1px solid var(--line);background:#142328b0;border-radius:5px;padding:9px 15px;transition:.2s}button:hover{border-color:var(--gold);background:#31423b}button:disabled{opacity:.45;cursor:default}button:focus-visible,[role=button]:focus-visible{outline:2px solid var(--gold);outline-offset:4px}[hidden]{display:none!important}#game{width:100%;height:100svh;min-height:560px;overflow:hidden;position:relative;background:#14272d}#scene,.vignette,#dust{position:absolute;inset:0;pointer-events:none}#scene{background:url(assets/user-scene.png) center center/cover no-repeat}.vignette{background:linear-gradient(#06121b70,transparent 25%,transparent 50%,#071218bd 80%),linear-gradient(90deg,#06131b70,transparent 40%,transparent 70%,#06131b65)}header{position:absolute;top:4.8%;left:4%;right:4%;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:14px;align-items:center}.sigil{font-size:44px;color:var(--gold)}h1{margin:0;font-size:28px;letter-spacing:10px;font-family:serif;font-weight:500}h1 span{font-family:sans-serif;font-size:11px;letter-spacing:4px;border-left:1px solid var(--line);margin-left:13px;padding-left:18px}header p{font-size:8px;letter-spacing:4.5px;margin:9px 0 0;color:#9ba9a5}.top-actions{display:flex;align-items:center;gap:10px}.top-actions>span{font-size:12px;color:#d5c5a4;margin-right:15px}.top-actions button{padding:8px 11px;border-radius:50%;font-size:18px}.chapter{position:absolute;left:5%;top:25%;font-size:13px;color:#c9cbb8;letter-spacing:3px}.chapter i{display:block;width:45px;border-top:1px solid #d8b97980;margin:19px 0}.chapter p{color:#9baaa6;font-size:12px;line-height:2.2;letter-spacing:1px}.location{position:absolute;top:58%;left:50%;transform:translateX(-50%);font-size:10px;letter-spacing:3px;color:#d0c39c}.location span{display:inline-block;width:4px;height:4px;background:#e3d3a0;transform:rotate(45deg);margin-right:7px}#altar{position:absolute;left:50%;top:65%;width:180px;height:100px;transform:translate(-50%,-50%);cursor:pointer;touch-action:none}#ring{position:absolute;inset:40px 0 0;border:1px solid #d9c78666;border-radius:50%;box-shadow:0 0 35px #e6c88122,inset 0 0 24px #e6c88113}#ring:after{content:"";position:absolute;inset:8px;border:1px dashed #d9c78640;border-radius:50%}#empty{text-align:center;position:relative;color:#d6c58e;font-size:26px;padding-top:20px}#empty small{display:block;font-size:10px;letter-spacing:2px;margin-top:5px;color:#c4c1a0}#offering{position:absolute;inset:-12px 25px 20px;display:flex;align-items:center;justify-content:center;font-size:60px;filter:drop-shadow(0 5px 18px #edcb7440);transition:.3s}#offering img{max-height:100%;max-width:100%;object-fit:contain}#offering.vanish{opacity:0;transform:scale(.1) rotate(25deg)}.exchange-ui{position:absolute;top:41%;right:5%;width:245px;text-align:center}.eyebrow{font-size:10px;letter-spacing:2px;color:#a3afa7}#message{font-size:12px;line-height:1.9;min-height:36px;margin:12px 0 19px}.primary{border:1px solid #bda36f;background:linear-gradient(110deg,#ab8c54,#d5bc82);color:#202b2b;box-shadow:0 4px 25px #c6a86315;padding:13px 25px;min-width:190px;font-weight:600;letter-spacing:3px}.primary:hover{background:#e3cb96}.primary span{margin-left:22px}#cancel{font-size:10px;display:block;margin:7px auto;background:transparent;border:none;color:#aaa}.night{position:absolute;left:5%;top:57%;font-size:12px;color:#b2b9a8}.night b{font-size:26px;font-family:serif;font-weight:400;color:var(--gold);margin:0 6px}.night p{font-size:10px;color:#869b95}.night button{padding:8px 0;background:none;border:none;font-size:10px;color:#d0ba8b}#crow{position:absolute;left:44%;top:24%;width:75px;height:75px;transform-origin:50% 60%;pointer-events:none}#crow img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(1px 2px 2px #0009)}#crow.flying{animation:fly 1.8s ease-in-out}#crow.flying img{animation:flap .16s ease-in-out infinite alternate}@keyframes fly{0%,100%{transform:translate(0,0) rotate(0)}25%{transform:translate(-70px,-80px) rotate(-20deg)}55%{transform:translate(100px,-120px) rotate(12deg)}75%{transform:translate(75px,-35px) rotate(25deg)}}@keyframes flap{to{transform:scaleY(.65) rotate(-10deg)}}#inventory{position:absolute;bottom:3%;left:4%;right:4%;padding:16px 24px 10px;background:linear-gradient(125deg,#1c2c2ee8,#102024ed);border:1px solid #8d9e8050;box-shadow:0 12px 40px #0005;border-radius:9px;backdrop-filter:blur(12px)}.inventory-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.inventory-heading>div{display:flex;align-items:center;gap:12px}.inventory-heading strong{font-size:13px;letter-spacing:2px;font-weight:500}.bag-icon{font-size:22px;color:#dac38c}#count{font-size:10px;color:#9bab9c}.inventory-tools button{font-size:10px;padding:5px 10px;background:transparent;border-color:transparent;color:#bcbdab}.inventory-tools #addBtn{border-color:var(--line)}#items{display:flex;gap:12px;overflow-x:auto;padding:2px 2px 6px;scrollbar-width:thin;scrollbar-color:#bfa97950 transparent}.item{flex:0 0 112px;height:100px;border:1px solid #a8b09a30;background:linear-gradient(130deg,#a2bda40c,#07161a50);border-radius:5px;padding:6px 9px;position:relative;text-align:center;touch-action:pan-x}.item:hover,.item.selected{border-color:#d5bc82;background:#9eaf7820;transform:translateY(-2px)}.item .art{display:flex;height:49px;align-items:center;justify-content:center;font-size:32px;filter:drop-shadow(0 3px 5px #0005)}.art img{width:100%;height:100%;object-fit:contain}.item .name{display:block;font-size:10px;color:#dddac4;margin:2px 0 4px}.item .value{font-size:9px;color:#c4ab77}.qty{position:absolute;right:7px;top:6px;font-size:9px;color:#9cae9c}.inventory-hint{font-size:9px;letter-spacing:1px;color:#80918a;margin:8px 0 0;display:flex;justify-content:space-between}.inventory-hint span{color:#a7ad94}#inventory.collapsed #items,#inventory.collapsed .inventory-hint{display:none}#inventory.collapsed .inventory-heading{margin:0}.prototype{position:absolute;bottom:5px;left:50%;transform:translateX(-50%);font-size:8px;color:#617a78;white-space:nowrap}.spark{position:absolute;left:50%;top:45%;width:5px;height:9px;background:var(--c);animation:burst 1.4s ease-out forwards;pointer-events:none}@keyframes burst{0%{opacity:1;transform:translate(0,0) rotate(0)}100%{opacity:0;transform:translate(var(--x),var(--y)) rotate(540deg)}}.mote{position:absolute;width:2px;height:2px;background:#efd9a8;border-radius:50%;opacity:.3;animation:drift var(--d) linear infinite}@keyframes drift{50%{transform:translate(20px,-45px);opacity:.7}100%{transform:translate(-5px,-100px);opacity:0}}#portrait{display:none}dialog{width:min(480px,90vw);max-height:85vh;overflow:auto;background:#15272b;color:#eee1c6;border:1px solid #ac986450;border-radius:12px;padding:30px;box-shadow:0 15px 100px #0008}dialog::backdrop{background:#041015bb;backdrop-filter:blur(6px)}#closeModal{position:absolute;right:12px;top:8px;border:none;background:none;font-size:24px}dialog h2{font-family:serif;font-weight:400;letter-spacing:3px;margin-top:0}dialog p,dialog li{font-size:12px;line-height:2;color:#b1c0b5}dialog li{margin:8px 0}dialog label{display:block;font-size:12px;margin:16px 0 6px;color:#cbbb95}dialog input,dialog select{width:100%;padding:10px;border-radius:4px;background:#0d1c20;border:1px solid #76887850;color:#e1dcc9}dialog .primary{margin-top:20px;width:100%}.setting-row{display:flex;align-items:center;gap:12px}.setting-row input{width:70%}.logs{border-top:1px solid var(--line);padding:10px 0;font-size:12px;line-height:1.8}.tag{font-size:9px;letter-spacing:2px;color:var(--gold)}
@media(max-height:650px) and (orientation:landscape){#game{min-height:320px}header{top:4%}.brand h1{font-size:21px}.sigil{font-size:30px}header p{font-size:6px;margin-top:5px}.top-actions button{font-size:14px;padding:5px 8px}.chapter{top:25%;font-size:10px}.chapter p{font-size:9px;line-height:1.8}.chapter i{margin:10px 0}.exchange-ui{top:34%;width:200px;right:4%}#message{font-size:10px;margin:8px 0;min-height:25px}.eyebrow{font-size:8px}.primary{padding:10px 17px;font-size:12px;min-width:155px}.night{top:51%}.night p{display:none}.night b{font-size:21px}#inventory{bottom:3%;padding:8px 14px 6px}.inventory-heading{margin-bottom:5px}.item{flex-basis:90px;height:77px;padding:3px 6px}.item .art{height:35px;font-size:27px}.item .name{font-size:9px;margin:2px 0}.inventory-hint{font-size:7px;margin-top:3px}#items{gap:8px;padding-bottom:3px}#altar{top:59%;width:145px;height:75px}#offering{font-size:42px}#ring{top:25px}#empty{font-size:20px;padding-top:8px}#empty small{font-size:8px}.location{top:47%;font-size:8px}#crow{width:55px;height:55px;top:23%}.prototype{font-size:6px;bottom:1px}}
@media(orientation:portrait){#portrait{position:fixed;inset:0;background:#0b1d24f5;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:20}#portrait>div{font-size:55px;color:var(--gold)}#portrait h2{font-family:serif;letter-spacing:6px;font-weight:400}#portrait p{font-size:13px;color:#9bafa5}#portrait button{margin-top:20px}body.portrait-preview #portrait{display:none}body.portrait-preview #game{min-width:760px;width:760px;height:440px;min-height:440px;transform:scale(calc(100vw / 760));transform-origin:top left}.top-actions>span{display:none}}


#scene{background-size:100% 100%}#crow{translate:-65% -93%}

@media(max-height:650px) and (orientation:landscape){#inventory{height:112px;padding:6px 14px}.inventory-heading{height:23px;margin-bottom:3px}#items{height:68px}.item{height:62px}.item .art{height:25px;font-size:23px}.item .name{line-height:13px}.item .value{line-height:12px}.inventory-hint{display:none}#inventory.collapsed{height:37px}}

#crow{translate:-65% -80%}header,#inventory{left:max(4%,calc(env(safe-area-inset-left) + 8px));right:max(4%,calc(env(safe-area-inset-right) + 8px))}@media(max-height:650px) and (orientation:landscape){#altar{top:57.5%}}


#altar{top:80%}.location{top:70%}#inventory.collapsed{padding-top:10px;padding-bottom:10px}.vignette{background:linear-gradient(#07121980,transparent 28%,transparent 65%,#07121985),linear-gradient(90deg,#07121955,transparent 35%,transparent 72%,#07121950)}@media(max-height:650px) and (orientation:landscape){#altar{top:80%}#inventory.collapsed{height:37px;padding-top:6px;padding-bottom:6px}.location{top:66%}}

/* AI authored eight-frame wingbeat replaces the earlier scale animation. */
.brand h1{font-size:24px;letter-spacing:4px}.brand p{letter-spacing:3px}
#crow canvas{display:none;position:absolute;width:150%;height:200%;left:-25%;top:-57%;filter:drop-shadow(1px 3px 2px #0006)}
#crow.flying{animation:ravenFlightPath 1.5s cubic-bezier(.35,0,.4,1) both}
#crow.flying img{animation:none;visibility:hidden}
#crow.flying canvas{display:block}
@keyframes ravenFlightPath{0%{transform:translate(0,0) rotate(-8deg)}15%{transform:translate(30px,-42px) rotate(-12deg)}40%{transform:translate(110px,-66px) rotate(2deg)}60%{transform:translate(140px,-44px) rotate(8deg)}78%{transform:translate(60px,-28px) rotate(1deg)}92%{transform:translate(12px,-10px) rotate(-6deg)}100%{transform:translate(0,0) rotate(0)}}
@media(max-height:650px) and (orientation:landscape){.brand h1{font-size:19px;letter-spacing:2px}.brand p{font-size:6px;letter-spacing:2px}}

/* Front view is preserved in both animation states. */
#crow{translate:-50% -94%}
#crow canvas{display:block;position:absolute;width:100%;height:100%;left:0;top:0;transform-origin:50% 94%;animation:ravenBreathing 3.4s ease-in-out infinite}
#crow.flying canvas{width:200%;height:200%;left:-50%;top:-40%;animation:none;transform:none}
#crow.flying{animation:ravenFrontFlight 1.5s ease-in-out both}
@keyframes ravenBreathing{0%,100%{transform:scale(1,1)}50%{transform:scale(1.014,1.022)}}
@keyframes ravenFrontFlight{0%,100%{transform:translate(0,0) scale(1)}18%{transform:translate(0,-22px) scale(1.015)}42%{transform:translate(-3px,-40px) scale(1.04)}66%{transform:translate(3px,-37px) scale(1.04)}84%{transform:translate(0,-18px) scale(1.02)}}

/* Scene-wide route is driven by the animation clock, not a perch-local hover. */
#crow{z-index:8;will-change:transform}#crow.flying{animation:none}header{z-index:10}
