@charset "UTF-8";
:root{color-scheme:light;--ink:#203539;--muted:#68796b;--cream:#fffef0;--line:#354c4d;--orange:#f89243;--yellow:#ffdb71;font-family:"Microsoft YaHei UI","Microsoft YaHei",system-ui,sans-serif;font-weight:500;color:var(--ink)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#b7daea}button,input,textarea{font:inherit}button{color:inherit;cursor:pointer;border:1.5px solid var(--line);background:var(--cream);border-radius:9px;transition:transform .13s,background .13s}button:hover{background:#fff4d0;transform:translateY(-1px)}button:active{transform:translateY(2px) scale(.97)}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #ffbf5d;outline-offset:3px}button:disabled{opacity:.5;cursor:default}.primary{background:var(--orange);color:#fffef2;border:2px solid #8c532d;box-shadow:0 3px 0 #b06a39;font-weight:900;padding:12px 20px}.primary:hover{background:#ffa454}small{font-size:10px}[hidden]{display:none!important}#world,#scene{position:fixed;inset:0;width:100%;height:100%}#scene{display:block;touch-action:none}.vignette{position:fixed;inset:0;pointer-events:none;box-shadow:inset 0 0 100px #476e4f15}.panel{background:#fffef0ed;border:2px solid var(--line);border-radius:15px;box-shadow:0 4px 0 #243c3430}.eyebrow{letter-spacing:1.5px;font-size:10px;color:#7d8a6d;font-weight:800}.health{height:6px;background:#ced8c0;border-radius:8px;overflow:hidden}.health i{display:block;width:100%;height:100%;background:#7cb681;transition:width .2s}.boss-hud{position:fixed;top:86px;left:50%;width:330px;transform:translateX(-50%);z-index:4;background:#392d37ed;color:#fff6d7;border:2px solid #feac67;border-radius:13px;padding:10px 15px;box-shadow:0 4px 0 #341f2b55}.boss-hud>span{font-weight:900;font-size:14px}.boss-hud>b{float:right;font-size:12px;color:#ffac74}.boss-hud .health{margin-top:9px;background:#68505a}.boss-hud .health i{background:#ff896c}input,textarea{background:#fff;border:1.5px solid #98ac95;border-radius:8px;color:var(--ink);font-size:12px}.run-banner{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:min(450px,90vw);z-index:7;background:#fff8e9f5;border:3px solid #394c46;border-radius:20px;padding:25px;box-shadow:0 8px 0 #2239324d;text-align:center}.run-banner>span{font-size:11px;color:#bc8552}.run-banner strong{display:block;font-size:28px;margin-top:8px}.run-banner p{font-size:12px;line-height:1.8}.run-banner button{margin-top:10px}#pause-indicator{position:fixed;bottom:190px;left:50%;transform:translateX(-50%);border-radius:30px;background:#1b3737d9;border:1px solid #edebc8;color:#fff8dd;padding:10px 20px;z-index:6;font-size:14px;text-align:center}#pause-indicator small{display:block;font-size:9px;margin-top:3px;opacity:.7}#impact-wash{position:fixed;inset:0;box-shadow:inset 0 0 95px #ff944a;opacity:0;pointer-events:none;z-index:2}#mutation-burst{position:fixed;top:27%;left:50%;width:min(570px,calc(100vw - 30px));transform:translateX(-50%);z-index:5;pointer-events:none;text-align:center;filter:drop-shadow(0 5px 0 #28463855)}#burst-kind{display:inline-block;letter-spacing:4px;font-size:13px;font-weight:900;background:#213e3c;color:#f8df8c;padding:5px 14px;transform:rotate(-3deg);border:2px solid #fff6bf;border-radius:6px}#burst-name{font-size:clamp(25px,4.4vw,53px);font-weight:1000;color:#fff9d8;line-height:1.1;margin:13px 0 5px;text-shadow:3px 0 #684729,-3px 0 #684729,0 3px #684729,0 -3px #684729,5px 6px #d37b3b;letter-spacing:2px}#burst-level{display:inline-block;border-radius:7px;color:#fff6b9;background:#c06535;padding:3px 11px;border:2px solid #fff2a8;font-size:15px;transform:rotate(4deg)}#burst-description{display:table;margin:13px auto 0;max-width:440px;background:#fff9e4ed;border:1px solid #8a9a73;border-radius:9px;padding:8px 13px;font-size:12px;line-height:1.7;color:#475740}#mutation-burst.exploding{animation:burst-show 2.9s both}.flying-word{position:fixed;z-index:5;pointer-events:none;left:50%;top:52%;font-size:clamp(15px,2vw,24px);font-weight:900;color:#fff9cf;text-shadow:2px 2px #855b36,-1px -1px #855b36;white-space:nowrap;animation:word-fly 1.9s cubic-bezier(.12,.65,.22,1) forwards}.food-pop{animation:food-pop .35s ease-out}#joystick{display:none}#intro{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(420px,92vw);padding:30px;z-index:7;box-shadow:0 10px 0 #244a3d44}#intro h1{font-size:54px;line-height:1.04;letter-spacing:-2px;margin:20px 0;color:#253e37}#intro h1 em{color:#e17d38;font-style:normal}#intro p{font-size:12px;line-height:1.9;color:#6d7c63}#intro>.primary{width:100%;margin:18px 0 13px;font-size:19px}#intro>small{display:block;text-align:center;font-size:9px;color:#879377}.intro-steps{display:flex;justify-content:space-between;font-size:9px;color:#8c9d67;margin-top:22px}#loading,#failure{position:fixed;inset:0;display:grid;place-content:center;text-align:center;background:#eff0d8;z-index:20;color:#5c7861}#loading>span{font-size:55px;color:#edac53;animation:food-pop .6s infinite alternate}#loading p,#failure p{font-size:13px}#failure{padding:30px}#failure button{padding:12px;margin-top:15px}#modal-backdrop{position:fixed;inset:0;background:#1e3a365c;backdrop-filter:blur(4px);z-index:12;display:grid;place-items:center;padding:24px}#modal{width:min(760px,100%);max-height:85dvh;overflow:auto;background:#fffdef;border:2px solid #37544b;border-radius:20px;box-shadow:0 8px 0 #1c372d55;padding:24px}#modal>header{display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid #d9e0c3;padding-bottom:16px;margin-bottom:15px}#modal h2{font-size:24px;margin:7px 0 0}#close-modal{font-size:22px;width:35px;height:35px}#modal-content>p{font-size:12px;line-height:1.8;color:#687a5e}.book-grid,.food-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.book-card,.food-card{border:1px solid #cdd7b7;background:#f8f9e8;border-radius:12px;padding:13px}.book-card h3,.food-card h3{font-size:14px;margin:0 0 8px}.book-card p,.food-card p{font-size:11px;line-height:1.7;margin:5px 0;color:#728367}.level-tag{display:inline-block;font-size:10px;background:#ffe3a0;color:#946032;border-radius:5px;padding:3px 7px;margin-left:5px}.food-icon{font-size:23px;display:inline-block;margin-right:6px}.level-pips{display:flex;gap:3px;margin:10px 0}.level-pips i{height:4px;flex:1;background:#dce5c7;border-radius:3px}.level-pips i.on{background:#efac51}.modal-actions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.modal-actions button{padding:9px 12px;font-size:11px}textarea{width:100%;height:100px;resize:vertical;padding:10px;font-size:11px}.section-label{font-size:12px;letter-spacing:1px;margin:22px 0 11px;color:#a57c45}.book-note{padding:10px;background:#f1eed5;border-radius:9px}details{font-size:11px;line-height:1.8;margin-top:10px}.save-archive{padding:9px;border:1px solid #d8dfc4;border-radius:8px;margin-top:7px;display:flex;justify-content:space-between;gap:10px;font-size:10px}.save-archive button{font-size:9px}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes burst-show{0%{opacity:0;transform:translate(-50%,65px) scale(.18) rotate(-18deg)}10%{opacity:1;transform:translate(-50%,-15px) scale(1.15) rotate(3deg)}17%{transform:translate(-50%,0) scale(.96) rotate(-2deg)}25%,75%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-32%,-80px) scale(.7) rotate(7deg)}}@keyframes word-fly{0%{opacity:0;transform:translate(-50%,10px) scale(.2) rotate(-12deg)}12%{opacity:1;transform:translate(calc(-50% + var(--fly-x)*.25),-20px) scale(1.2)}35%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--fly-x)),var(--fly-y)) scale(.65) rotate(var(--fly-r))}}@keyframes food-pop{0%{transform:scale(1)}35%{transform:scale(1.27);color:#fe9b3a}100%{transform:scale(1)}}
@media(max-width:900px){.boss-hud{top:73px;width:280px}}
@media(max-width:600px){.boss-hud{top:212px;width:260px;padding:8px 11px;border-radius:9px}.boss-hud>span{font-size:11px}.boss-hud>b{font-size:10px}.boss-hud .health{height:4px;margin-top:5px}#joystick{position:fixed;display:block;left:22px;bottom:110px;width:94px;height:94px;border-radius:50%;border:2px solid #f6f5c58c;background:#254d4547;z-index:5;touch-action:none;box-shadow:inset 0 0 0 15px #f4f3c918}#joystick span{position:absolute;inset:24px;border:1px solid #fffae140;border-radius:50%}#stick-knob{position:absolute;left:28px;top:28px;width:34px;height:34px;background:#fff8dfbb;border:2px solid #435e4a;border-radius:50%;box-shadow:0 3px 0 #1b3e3f33}#joystick small{position:absolute;top:100%;left:0;right:0;text-align:center;color:white;font-size:8px;margin-top:5px;text-shadow:0 1px 2px #16342a}#mutation-burst{top:33%}#burst-name{font-size:28px;letter-spacing:1px;margin:9px 0 5px}#burst-kind{font-size:10px;padding:4px 9px;letter-spacing:2px}#burst-level{font-size:12px}#burst-description{font-size:10px;max-width:280px;padding:7px 10px}#pause-indicator{bottom:228px;font-size:12px}#modal-backdrop{padding:12px}#modal{max-height:88dvh;padding:17px;border-radius:15px}#modal h2{font-size:20px}.book-grid,.food-grid{grid-template-columns:1fr}.book-card h3,.food-card h3{font-size:13px}.book-card p,.food-card p{font-size:10px}#intro{padding:24px;width:min(350px,90vw)}#intro h1{font-size:46px;margin-top:17px}#intro p{font-size:11px}#intro>small{font-size:8px}.intro-steps{font-size:8px}.run-banner{padding:20px}.run-banner strong{font-size:24px}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}#scene{transform:none!important}}

.speech-change #burst-kind{background:#5c4c87;color:#fff2c9}.speech-change #burst-level{background:#8060ad}
#npc-bubble{position:fixed;z-index:4;transform:translate(-50%,-100%);width:max-content;max-width:230px;min-width:140px;padding:9px 12px;background:#fff8e8ef;border:2px solid #746051;border-radius:13px;box-shadow:0 4px 0 #304d3b33;pointer-events:none}#npc-bubble::after{content:'';position:absolute;bottom:-8px;left:50%;width:12px;height:12px;background:#fff8e8;transform:rotate(45deg);border-right:2px solid #746051;border-bottom:2px solid #746051}#npc-bubble.player-bubble{border-color:#6f6484}#npc-bubble.player-bubble::after{border-color:#6f6484}#npc-bubble.answered{border-color:#df934e;background:#fff2bb}#npc-speaker{font-size:8px;color:#ab825d;letter-spacing:.5px}#npc-line{font-size:12px;line-height:1.6;margin:4px 0 0;color:#465447;font-weight:700}@media(max-width:600px){#npc-bubble{max-width:210px;padding:7px 10px;border-radius:10px}#npc-line{font-size:10px}#npc-speaker{font-size:7px}}#pause-indicator{top:270px;bottom:auto}#joystick{display:none!important;pointer-events:none;touch-action:none}#joystick.floating{display:block!important;position:fixed;width:94px;height:94px;left:0;top:0;bottom:auto;border-radius:50%;border:2px solid #fff8dcb0;background:#254d4547;z-index:8;box-shadow:inset 0 0 0 15px #f4f3c918}#joystick span{position:absolute;inset:24px;border:1px solid #fffae150;border-radius:50%}#stick-knob{position:absolute;left:28px;top:28px;width:34px;height:34px;background:#fff8dfc9;border:2px solid #435e4a;border-radius:50%;box-shadow:0 3px 0 #1b3e3f33}#joystick small{position:absolute;top:100%;left:0;right:0;text-align:center;color:#fffbe5;font-size:8px;margin-top:5px;text-shadow:0 1px 2px #16342a}
#mutation-burst{top:260px;left:12px;width:198px;max-width:calc(100vw - 24px);transform:none;padding:7px 10px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 7px;border:1.5px solid #9b814b;border-radius:10px;background:#fff8dce8;box-shadow:0 2px 0 #28463825;filter:none;text-align:left;z-index:5;pointer-events:none}#mutation-burst #burst-kind{grid-column:1/3;justify-self:start;border:0;background:none;color:#a87b35;letter-spacing:1px;font-size:8px;padding:0;transform:none}#mutation-burst #burst-name{font-size:15px;letter-spacing:0;line-height:1.25;text-shadow:none;color:#42523b;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;align-self:center}#mutation-burst #burst-level{font-size:11px;padding:2px 5px;border:0;border-radius:4px;background:#f6db95;color:#996238;transform:none;align-self:center}#mutation-burst #burst-description{display:none}#mutation-burst[data-kind=upgrade] #burst-kind{display:none}#mutation-burst[data-kind=combo]{border-color:#c18b55;background:#fff0cbed}#mutation-burst[data-kind=speech]{border-color:#8c79ac;background:#f6efffed}#mutation-burst.exploding{animation-name:side-notice-left;animation-timing-function:ease-out;animation-fill-mode:both}#mutation-burst[data-side=right].exploding{animation-name:side-notice-right}#flying-words{display:none}#boss-hud{top:0;left:0;width:190px;transform:none;padding:6px 9px;border:1.5px solid #e9a862;border-radius:8px;box-shadow:0 2px 0 #341f2b33;pointer-events:none;animation:none;z-index:3}#boss-title{font-size:12px!important}#boss-countdown{font-size:9px!important}#boss-hud .health{height:5px;margin-top:5px}#npc-bubble{z-index:4;max-width:210px;min-width:120px;padding:6px 9px}#npc-line{font-size:10px;line-height:1.45;margin-top:3px}#npc-speaker{font-size:7px}
@keyframes side-notice-left{0%{opacity:0;transform:translateX(-28px) scale(.88)}18%{opacity:1;transform:translateX(2px) scale(1.02)}32%,82%{opacity:1;transform:none}100%{opacity:0;transform:translateX(-8px)}}@keyframes side-notice-right{0%{opacity:0;transform:translateX(28px) scale(.88)}18%{opacity:1;transform:translateX(-2px) scale(1.02)}32%,82%{opacity:1;transform:none}100%{opacity:0;transform:translateX(8px)}}
#book-tabs{display:flex;gap:7px;margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid #d9e0c3}#book-tabs button{padding:8px 14px;font-size:12px}#book-tabs [aria-selected=true]{background:#f5d590;font-weight:900}.keyword-list{font-size:11px!important;padding:8px;background:#f0eadb;border-radius:6px;color:#897052!important}.dominance-summary{background:#fff0d2;border:1px solid #d7b978;border-radius:10px;padding:12px;margin-bottom:14px;font-size:12px;line-height:1.8}

@media(max-width:760px){#mutation-burst{width:178px;padding:6px 8px;border-radius:8px}#mutation-burst #burst-name{font-size:13px}#mutation-burst #burst-kind{font-size:7px}#mutation-burst #burst-level{font-size:10px}#boss-hud{width:160px;padding:5px 7px}#boss-title{font-size:10px!important}#boss-countdown{font-size:8px!important}#npc-bubble{max-width:180px;padding:6px 8px}#npc-line{font-size:9px}#npc-speaker{font-size:7px}#pause-indicator{top:270px;bottom:auto}}@media(max-width:760px){.book-card+.book-card{margin-top:8px}}.keyword-list{word-break:break-word}.dominance-summary p{margin:5px 0 0;font-size:11px}.health{height:5px;border:1px solid #31554977;background:#173e3b22}
#mutation-burst{padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important;display:block;width:250px;text-align:left;filter:drop-shadow(0 2px 0 #32544122)}#mutation-burst #burst-kind{display:block;padding:0 0 3px;background:none!important;color:#ffdd82;font-size:11px;font-weight:1000;letter-spacing:2px;-webkit-text-stroke:.35px #98673a;text-shadow:1px 1px 0 #775733;transform:rotate(-3deg)}#mutation-burst #burst-name{font-size:29px;line-height:1.08;letter-spacing:1px;font-weight:1000;font-style:italic;white-space:normal;overflow:visible;color:#fff8cb;-webkit-text-stroke:.65px #4a5f3b;text-shadow:2px 0 0 #566440,-2px 0 0 #566440,0 2px 0 #566440,0 -2px 0 #566440,3px 4px 0 #a8794355;transform:rotate(-3deg);margin:0}#mutation-burst #burst-level{display:inline-block;margin-top:4px;background:none!important;color:#ffd365;font-size:15px;font-weight:1000;font-style:italic;letter-spacing:1px;padding:0;-webkit-text-stroke:.35px #8d6034;text-shadow:1px 2px 0 #885b3b;transform:rotate(-4deg)}#mutation-burst[data-kind=speech] #burst-name{color:#f4e8ff;text-shadow:2px 0 #68587e,-2px 0 #68587e,0 2px #68587e,0 -2px #68587e,3px 4px #6e567744}#mutation-burst[data-kind=combo] #burst-name{color:#ffe7a1}#mutation-burst[data-side=right]{text-align:right}#mutation-burst[data-side=right] #burst-name,#mutation-burst[data-side=right] #burst-kind{transform:rotate(3deg)}#mutation-burst[data-kind=upgrade] #burst-kind{display:none}#mutation-burst[data-kind=upgrade] #burst-name{font-size:25px}#mutation-burst[data-kind=upgrade] #burst-level{font-size:13px}
@keyframes side-notice-left{0%{opacity:0;transform:translateX(-105%) scale(.7) rotate(-8deg)}18%{opacity:1;transform:translateX(7px) scale(1.08) rotate(2deg)}35%,82%{opacity:1;transform:none}100%{opacity:0;transform:translateX(-14px) scale(.96)}}@keyframes side-notice-right{0%{opacity:0;transform:translateX(105%) scale(.7) rotate(8deg)}18%{opacity:1;transform:translateX(-7px) scale(1.08) rotate(-2deg)}35%,82%{opacity:1;transform:none}100%{opacity:0;transform:translateX(14px) scale(.96)}}
#boss-hud{background:transparent;border:0;box-shadow:none;padding:3px 5px}#boss-title{font-size:14px!important;color:#ffebb4;font-weight:1000;-webkit-text-stroke:.3px #743d35;text-shadow:1px 1px 0 #623831,-1px -1px 0 #623831}#boss-countdown{color:#ffdc8f;text-shadow:1px 1px 0 #6b3d35}#boss-hud .health{height:7px;border:1px solid #ffdd92;background:#5c263d99;border-radius:3px}#boss-hud .health i{background:linear-gradient(90deg,#ed7154,#ffb36e)}#npc-bubble,#npc-bubble.player-bubble,#npc-bubble.answered{border:0;background:none;box-shadow:none;padding:2px 3px;border-radius:0;max-width:220px;filter:drop-shadow(0 1px 0 #29493844)}#npc-bubble::after{display:none}#npc-line{color:#fff8d8;font-weight:1000;font-size:12px;line-height:1.6;text-shadow:1px 0 #365246,-1px 0 #365246,0 1px #365246,0 -1px #365246,1px 2px #365246;-webkit-text-stroke:.15px #365246}#npc-speaker{color:#ffe4a9;text-shadow:1px 1px 0 #4b6450;font-weight:800}
@media(max-width:760px){#mutation-burst{width:182px}#mutation-burst #burst-name{font-size:23px;letter-spacing:0}#mutation-burst #burst-kind{font-size:9px;letter-spacing:1px}#mutation-burst #burst-level{font-size:13px}#mutation-burst[data-kind=upgrade] #burst-name{font-size:21px}#mutation-burst[data-kind=upgrade] #burst-level{font-size:12px}#npc-bubble{max-width:185px}#npc-line{font-size:10px}#boss-title{font-size:12px!important}}/* 0.5.3: local handwriting, crisp ink edges and a readable hold between impacts. */
@font-face{font-family:"Be0 Growth Brush";src:url("./assets/fonts/Be0GrowthBrush.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
#mutation-burst{width:292px;isolation:isolate;filter:none;transform-origin:15% 65%;will-change:transform,opacity}
#mutation-burst[data-side=right]{transform-origin:85% 65%}
#mutation-burst #burst-name,#mutation-burst #burst-kind,#mutation-burst #burst-level{font-family:"Be0 Growth Brush","KaiTi","STKaiti",serif;font-weight:400;font-style:normal;paint-order:stroke fill;text-rendering:optimizeLegibility;letter-spacing:0;transform:none}
#mutation-burst #burst-name{font-size:46px;line-height:1.14;color:#fff4bd;-webkit-text-stroke:3.5px #25353c;text-shadow:2px 4px 0 #162632c9,0 1px 0 #fffbe1;margin:0;overflow:visible;white-space:normal;word-break:normal}
#mutation-burst #burst-kind{font-size:18px;line-height:1.2;letter-spacing:1px;padding:0 0 5px;color:#ffe575;-webkit-text-stroke:2.5px #3b3030;text-shadow:1px 2px 0 #29353c}
#mutation-burst #burst-level{font-size:27px;line-height:1.1;color:#ffd45c;-webkit-text-stroke:2.5px #3c2a2d;text-shadow:2px 3px 0 #23313bbb;margin-top:5px;padding-right:2px}
#mutation-burst[data-kind=speech] #burst-name{color:#ffe7ff;-webkit-text-stroke-color:#3e294e;text-shadow:2px 4px 0 #25172fc9}
#mutation-burst[data-kind=combo] #burst-name{color:#ffe88d;-webkit-text-stroke-color:#4e3327;text-shadow:2px 4px 0 #35212bc9}
#mutation-burst[data-kind=upgrade] #burst-name{font-size:38px}#mutation-burst[data-kind=upgrade] #burst-level{font-size:24px}
#mutation-burst[data-side=right] #burst-name,#mutation-burst[data-side=right] #burst-kind{transform:none}
.burst-glyph{display:inline-block;transform-origin:35% 85%;animation:brush-letter-snap .28s cubic-bezier(.15,.8,.3,1.2) both;animation-delay:calc(.08s + var(--glyph-index)*.018s)}
#mutation-burst::before,#mutation-burst::after{content:"";position:absolute;pointer-events:none;z-index:-1;left:-12px;right:-5px;height:5px;top:45%;background:linear-gradient(90deg,transparent,#fff2a8 28%,#fff8d9 70%,transparent);clip-path:polygon(0 40%,100% 0,85% 65%,9% 100%);transform:rotate(-9deg);animation:none}
#mutation-burst.exploding::before,#mutation-burst.exploding::after{animation:brush-speed-line .38s ease-out both}#mutation-burst.exploding::after{animation-delay:.04s}
#mutation-burst::after{top:71%;height:3px;left:24px;right:-17px;transform:rotate(-9deg);animation-delay:.04s}
#mutation-burst[data-side=right]::before,#mutation-burst[data-side=right]::after{transform:rotate(9deg)}
@keyframes brush-letter-snap{0%{transform:translateY(13px) rotate(-12deg) scale(.65,1.3)}48%{transform:translateY(-4px) rotate(5deg) scale(1.15,.93)}100%{transform:none}}
@keyframes brush-speed-line{0%{opacity:0;scale:.2 1}35%{opacity:.95;scale:1.12 1}100%{opacity:0;scale:1.25 .4}}
@keyframes side-notice-left{0%{opacity:0;transform:translate3d(-130%,28px,0) rotate(-16deg) skewX(-12deg) scale(.65,1.18)}12%{opacity:1;transform:translate3d(17px,-7px,0) rotate(7deg) skewX(7deg) scale(1.12,.92)}22%{opacity:1;transform:translate3d(-6px,3px,0) rotate(-3deg) scale(.96,1.04)}34%,81%{opacity:1;transform:none}89%{opacity:1;transform:translate3d(4px,-3px,0) rotate(-2deg) scale(1.02)}100%{opacity:0;transform:translate3d(-48px,-32px,0) rotate(-12deg) scale(.82)}}
@keyframes side-notice-right{0%{opacity:0;transform:translate3d(130%,28px,0) rotate(16deg) skewX(12deg) scale(.65,1.18)}12%{opacity:1;transform:translate3d(-17px,-7px,0) rotate(-7deg) skewX(-7deg) scale(1.12,.92)}22%{opacity:1;transform:translate3d(6px,3px,0) rotate(3deg) scale(.96,1.04)}34%,81%{opacity:1;transform:none}89%{opacity:1;transform:translate3d(-4px,-3px,0) rotate(2deg) scale(1.02)}100%{opacity:0;transform:translate3d(48px,-32px,0) rotate(12deg) scale(.82)}}
@media(max-width:760px){#mutation-burst{width:188px}#mutation-burst #burst-name{font-size:34px;line-height:1.16;-webkit-text-stroke-width:3px;text-shadow:1px 3px 0 #162632cc}#mutation-burst #burst-kind{font-size:15px;-webkit-text-stroke-width:2px}#mutation-burst #burst-level{font-size:24px;-webkit-text-stroke-width:2.2px}#mutation-burst[data-kind=upgrade] #burst-name{font-size:30px}#mutation-burst[data-kind=upgrade] #burst-level{font-size:22px}}
@media(prefers-reduced-motion:reduce){.burst-glyph{animation:none}#mutation-burst.exploding{animation:none;opacity:1;transform:none}#mutation-burst::before,#mutation-burst::after{display:none}}
/* 0.5.4: distinct growth identities, all drawn as floating ink and tiny particles. */
#mutation-burst{--notice-fill:#d3ff97;--notice-ink:#164e42;--notice-accent:#67ffd6;--notice-accent2:#d3ff67;--notice-accent3:#fff7a5;--fx-scale:1}
#mutation-burst[data-kind=new]{--notice-fill:#d3ff97;--notice-ink:#174b37;--notice-accent:#6affda;--notice-accent2:#baff5b;--notice-accent3:#fff5a5}
#mutation-burst[data-kind=upgrade]{--notice-fill:#ffd151;--notice-ink:#6b321c;--notice-accent:#ff9d3f;--notice-accent2:#ffed79;--notice-accent3:#fff7df}
#mutation-burst[data-kind=combo]{--notice-fill:#ffbc72;--notice-ink:#642254;--notice-accent:#ff73b7;--notice-accent2:#6deaff;--notice-accent3:#ffdb61}
#mutation-burst[data-kind=speech]{--notice-fill:#fbe0ff;--notice-ink:#5b205f;--notice-accent:#f368ff;--notice-accent2:#5effee;--notice-accent3:#b9a0ff}
#mutation-burst #burst-name,#mutation-burst[data-kind=speech] #burst-name,#mutation-burst[data-kind=combo] #burst-name{color:var(--notice-fill);-webkit-text-stroke-color:var(--notice-ink);text-shadow:2px 4px 0 var(--notice-ink),3px 1px 0 var(--notice-accent2)}
#mutation-burst #burst-kind{color:var(--notice-accent2);-webkit-text-stroke-color:var(--notice-ink);text-shadow:1px 2px 0 var(--notice-ink);font-size:18px;line-height:1.25;letter-spacing:0}
#mutation-burst[data-kind=speech] #burst-kind{color:#7bfff3;-webkit-text-stroke-color:#622466;font-size:20px}
#mutation-burst[data-kind=upgrade] #burst-kind{display:block;color:#ffe79a}
#mutation-burst #burst-level{color:var(--notice-accent3);-webkit-text-stroke-color:var(--notice-ink);text-shadow:2px 3px 0 var(--notice-ink)}
#mutation-burst::before,#mutation-burst::after{background:linear-gradient(90deg,transparent,var(--notice-accent) 22%,var(--notice-accent2) 62%,transparent)}
#burst-fx{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:visible}
.notice-mote{position:absolute;left:50%;top:50%;width:9px;height:15px;border-radius:80% 15% 80% 15%;background:var(--notice-accent);opacity:0;animation:notice-sprout .85s cubic-bezier(.1,.65,.25,1) both;animation-delay:var(--mote-delay);transform-origin:center}
.notice-mote:nth-child(3n+2){background:var(--notice-accent2)}.notice-mote:nth-child(3n){background:var(--notice-accent3)}
#mutation-burst[data-kind=upgrade] .notice-mote{width:7px;height:12px;border-radius:0;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);animation-name:notice-sparks;animation-duration:.65s}
#mutation-burst[data-kind=combo] .notice-mote{width:15px;height:18px;border-radius:0;clip-path:polygon(0 0,100% 26%,66% 56%,83% 100%,12% 74%,35% 44%);animation-name:notice-prism;animation-duration:1.1s}
#mutation-burst[data-kind=speech] .notice-mote{width:13px;height:13px;border-radius:0;clip-path:polygon(50% 0,62% 35%,100% 50%,62% 65%,50% 100%,38% 65%,0 50%,38% 35%);animation-name:notice-runes;animation-duration:1.25s;filter:drop-shadow(0 0 3px var(--notice-accent))}
#mutation-burst[data-kind=new] .burst-glyph{animation-name:germ-letter}#mutation-burst[data-kind=upgrade] .burst-glyph{animation-name:upgrade-letter;animation-duration:.24s}#mutation-burst[data-kind=combo] .burst-glyph{animation-name:prism-letter;animation-duration:.42s}#mutation-burst[data-kind=speech] .burst-glyph{animation-name:spell-letter;animation-duration:.38s}
#mutation-burst[data-kind=combo].exploding #burst-level{animation:level-smash .48s cubic-bezier(.12,.8,.3,1.2) both}#mutation-burst[data-kind=upgrade].exploding #burst-level{animation:level-smash .29s cubic-bezier(.12,.8,.3,1.2) both}
@keyframes notice-sprout{0%{opacity:0;transform:translate(0,10px) scale(.1) rotate(-70deg)}28%{opacity:1}100%{opacity:0;transform:translate(calc(var(--mote-x)*var(--fx-scale)),calc(var(--mote-y)*var(--fx-scale) - 18px)) scale(.8) rotate(var(--mote-spin))}}
@keyframes notice-sparks{0%{opacity:1;transform:translate(0,0) scale(.1,1.6)}100%{opacity:0;transform:translate(calc(var(--mote-x)*var(--fx-scale)),calc(var(--mote-y)*var(--fx-scale))) rotate(var(--mote-spin)) scale(.1,.7)}}
@keyframes notice-prism{0%{opacity:0;transform:scale(0) rotate(-40deg)}15%,50%{opacity:1}65%{transform:translate(calc(var(--mote-x)*var(--fx-scale)*.82),calc(var(--mote-y)*var(--fx-scale)*.82)) rotate(var(--mote-spin)) scale(1.1)}100%{opacity:0;transform:translate(calc(var(--mote-x)*var(--fx-scale)*1.12),calc(var(--mote-y)*var(--fx-scale)*1.12)) rotate(var(--mote-spin)) scale(.3)}}
@keyframes notice-runes{0%{opacity:0;transform:translate(0,0) scale(.1) rotate(-130deg)}30%{opacity:1;transform:translate(calc(var(--mote-x)*var(--fx-scale)*.7),calc(var(--mote-y)*var(--fx-scale)*.7)) scale(1.3) rotate(30deg)}70%{opacity:1}100%{opacity:0;transform:translate(calc(var(--mote-x)*var(--fx-scale)),calc(var(--mote-y)*var(--fx-scale) - 16px)) scale(.1) rotate(var(--mote-spin))}}
@keyframes germ-letter{0%{transform:translateY(16px) scale(.6,1.35) rotate(-9deg)}55%{transform:translateY(-4px) scale(1.12,.93) rotate(4deg)}100%{transform:none}}
@keyframes upgrade-letter{0%{transform:translateY(-9px) scale(1.25,.7)}60%{transform:translateY(3px) scale(.95,1.08)}100%{transform:none}}
@keyframes prism-letter{0%{transform:rotateY(85deg) rotate(-12deg) scale(.4,1.2)}55%{transform:rotateY(-12deg) rotate(5deg) scale(1.16,.95)}100%{transform:none}}
@keyframes spell-letter{0%{transform:translateY(-18px) rotate(-15deg) scale(.6);color:var(--notice-accent2)}55%{transform:translateY(4px) rotate(5deg) scale(1.12);color:var(--notice-accent)}100%{transform:none;color:inherit}}
@keyframes level-smash{0%{transform:scale(1.8) rotate(-14deg)}55%{transform:scale(.88) rotate(6deg)}100%{transform:none}}
@media(max-width:760px){#mutation-burst{--fx-scale:.64}#mutation-burst #burst-kind{font-size:15px}#mutation-burst[data-kind=speech] #burst-kind{font-size:16px}.notice-mote{width:7px;height:12px}#mutation-burst[data-kind=combo] .notice-mote{width:11px;height:13px}#mutation-burst[data-kind=speech] .notice-mote{width:10px;height:10px}}
@media(prefers-reduced-motion:reduce){.notice-mote{display:none}#mutation-burst .burst-glyph,#mutation-burst.exploding #burst-level{animation:none!important}}
.share-cover-first{position:absolute;left:-10000px;top:0;width:300px;height:300px;opacity:0;pointer-events:none}
#edge-warning{position:fixed;z-index:10;width:210px;text-align:center;pointer-events:none;color:#fff1ac;filter:drop-shadow(0 2px 1px #593d30);transform:translateX(-50%)}
#edge-warning[hidden]{display:none}#edge-warning strong{display:block;font:25px/1.15 'Be0 Growth Brush','Microsoft YaHei',sans-serif;-webkit-text-stroke:1.2px #77453a;paint-order:stroke fill;animation:edge-wobble .55s ease-in-out infinite alternate}#edge-warning span{display:block;font-size:11px;line-height:1.6;color:#fffce4;text-shadow:0 1px 2px #52372b}#edge-warning>i{display:block;margin:3px auto 0;width:112px;height:3px;border-radius:3px;background:#654c3e66;overflow:hidden}#edge-warning-fill{display:block;height:100%;background:linear-gradient(90deg,#ffe98b,#ff956a);transform-origin:left;transition:width .1s linear}
#mutation-burst[data-kind=return]{--notice-fill:#fff2a5;--notice-ink:#2b686a;--notice-accent:#78e8e0;--notice-accent2:#ffdc8a;--notice-accent3:#e0fff8}#mutation-burst[data-kind=return] .burst-glyph{animation-name:germ-letter}#mutation-burst[data-kind=return] #burst-level{font-size:24px}
#mutation-burst[data-kind=repair]{--notice-fill:#e6ffcf;--notice-ink:#225a45;--notice-accent:#7affd6;--notice-accent2:#fff0a1;--notice-accent3:#dcfffa}#mutation-burst[data-kind=repair] #burst-level{font-size:22px}
@keyframes edge-wobble{from{transform:rotate(-3deg) translateY(0)}to{transform:rotate(3deg) translateY(2px)}}
@media(max-width:760px){#edge-warning{width:180px}#edge-warning strong{font-size:22px}#mutation-burst[data-kind=return] #burst-level{font-size:19px}}
@media(prefers-reduced-motion:reduce){#edge-warning strong{animation:none}}
#fall-count-pop{position:fixed;z-index:10;pointer-events:none;white-space:nowrap;transform:translate(-50%,-100%);color:#fff5ba;filter:drop-shadow(0 2px 1px #331520aa)}
#fall-count-pop strong{display:block;font:clamp(21px,4.6vw,32px)/1.15 'Be0 Growth Brush','Microsoft YaHei',sans-serif;-webkit-text-stroke:1.6px #4b2331;paint-order:stroke fill;text-shadow:0 2px #4b2331}
#fall-count-pop[data-terminal=true]{color:#ff927a}
#dash-status {
  position: fixed;
  z-index: 5;
  left: var(--dash-hint-left, 50%);
  top: calc(var(--dash-hint-top, 90vh) - env(safe-area-inset-bottom, 0px));
  width: 56px;
  transform: translate(-50%, -50%);
  pointer-events: none;
  user-select: none;
  text-align: center;
  white-space: nowrap;
  color: #fff8de;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  text-shadow: 0 1px 2px #152f39, 0 2px 5px #142b38;
}
#dash-status span, #dash-status strong { display: block; }
#dash-status strong { margin-top: 2px; color: #d4ffed; font-size: 15px; font-variant-numeric: tabular-nums; }
#dash-status.cooling strong { color: #ffdc92; }
#run-banner{z-index:11}
#run-banner[data-reason=fall_limit] #run-result,#run-banner[data-reason=combat] #run-result{color:#822e35}
#active-skills{position:fixed;right:18px;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:12;pointer-events:auto;width:300px;user-select:none;touch-action:none}#active-skills[hidden]{display:none}.skill-caption{display:block;text-align:right;margin:0 4px 5px;color:#fff4ba;font-size:12px;font-weight:900;text-shadow:0 2px 2px #263f4c}.skill-caption small{font-size:9px;margin-left:5px;color:#d6f7f3}#active-skill-buttons{display:grid;grid-template-columns:repeat(5,1fr);gap:8px 6px}.active-skill{--skill-angle:360deg;position:relative;width:54px;height:54px;border:2px solid #24484b;border-radius:50%;padding:0;color:white;background:conic-gradient(var(--skill-color) var(--skill-angle),#233c4d9c 0);box-shadow:0 3px 0 #253c45a0,inset 0 0 0 3px #fff8;cursor:pointer;touch-action:manipulation;transition:transform .12s,filter .12s}.active-skill[hidden]{display:none}.active-skill:active{transform:translateY(3px) scale(.91)}.active-skill:disabled{cursor:default;filter:saturate(.65)}.skill-icon{position:absolute;inset:6px 5px 15px;display:grid;place-items:center;font-size:22px;font-weight:900;line-height:1;text-shadow:0 2px 2px #243743}.skill-label{position:absolute;bottom:5px;left:0;right:0;text-align:center;font-size:9px;font-weight:900;line-height:1;white-space:nowrap;text-shadow:0 1px 2px #14323d}.skill-key{position:absolute;right:-2px;top:-4px;min-width:13px;height:13px;display:grid;place-items:center;border-radius:50%;color:#23474a;background:#fff8cc;font-size:9px;font-weight:900;font-style:normal}.skill-timer{position:absolute;inset:5px 0 10px;display:grid;place-items:center;font-size:24px;line-height:1;color:#fff7d4;text-shadow:0 2px 2px #273640,1px 0 #273640}.skill-timer:empty{display:none}.active-skill:disabled .skill-icon{opacity:.3}.active-skill.skill-running{box-shadow:0 3px 0 #253c45a0,inset 0 0 0 3px #fff8,0 0 11px var(--skill-color);animation:skill-live .8s ease-in-out infinite alternate}@keyframes skill-live{to{filter:brightness(1.2)}}
@media(max-width:760px){#active-skills{right:10px;bottom:calc(11px + env(safe-area-inset-bottom,0px));width:260px}#active-skill-buttons{gap:6px 4px}.active-skill{width:48px;height:48px}.skill-icon{font-size:20px}.skill-label{font-size:8px;bottom:5px}.skill-timer{font-size:22px}.skill-caption{font-size:10px;margin-bottom:4px}.skill-caption small{display:none}}
@media(prefers-reduced-motion:reduce){.active-skill.skill-running{animation:none}}
.intro .intro-hook{color:#517c63;font-weight:700}
#active-skills .skill-caption{display:flex;align-items:center;justify-content:flex-end;gap:5px}#skill-caption-label{font-weight:900}#active-skills.no-skills{width:auto;pointer-events:none}#active-skills.no-skills #active-skill-buttons,#active-skills.no-skills .skill-caption small{display:none}#active-skills.no-skills .skill-caption{margin:0}

/* Keep page gestures out of combat controls; the canvas owns camera pinching. */
button,[role="button"],.intro,.run-banner{touch-action:manipulation}
#active-skills,#active-skills button{touch-action:none;-webkit-touch-callout:none}
.active-skill[aria-disabled="true"]{opacity:.5;cursor:default;filter:saturate(.65)}.active-skill[aria-disabled="true"] .skill-icon{opacity:.3}
.skill-automation-toggle{flex:0 0 auto;min-height:29px;margin-left:2px;padding:3px 8px;border:1.5px solid #b9eee5;border-radius:8px;background:#263d46dc;color:#eafff5;font:800 11px/1.2 'Microsoft YaHei',system-ui,sans-serif;white-space:nowrap;text-shadow:none;box-shadow:0 2px 0 #142b38a0;pointer-events:auto;cursor:pointer}.skill-automation-toggle[data-locked="true"]{border-color:#c4c1ad;color:#e3ddc7;background:#343e44d9}.skill-automation-toggle[data-enabled="true"]{border-color:#e5fff4;background:#a8ffe1;color:#153c36;box-shadow:0 2px 0 #206455,0 0 8px #86ffe84d}.skill-automation-toggle:active{transform:translateY(2px)}.skill-automation-toggle:focus-visible{outline:2px solid #fff2a3;outline-offset:3px}
#mutation-burst[data-kind=milestone]{--notice-fill:#ffe1b1;--notice-ink:#6b2031;--notice-accent:#ff7757;--notice-accent2:#fff3c8;--notice-accent3:#ffbec1}#mutation-burst[data-kind=automation]{--notice-fill:#d0ffe7;--notice-ink:#20543f;--notice-accent:#79ffd8;--notice-accent2:#fff2a8;--notice-accent3:#d6fcff}#mutation-burst[data-kind=milestone] #burst-level,#mutation-burst[data-kind=automation] #burst-level{font-size:20px}
.skill-automation-toggle[data-enabled="false"]:hover{background:#36545a}
@media(max-width:760px){.skill-automation-toggle{font-size:10px;padding:3px 6px;min-height:30px}#mutation-burst[data-kind=milestone] #burst-level,#mutation-burst[data-kind=automation] #burst-level{font-size:17px}}

@media(max-width:760px),(pointer:coarse){input,textarea{font-size:16px}}

/* The roster is read in a paused modal, never over the battle view. */
.follower-book-mark{float:right;display:block;font-size:36px;line-height:1.1;-webkit-text-stroke:.5px #243c3b;text-shadow:1px 2px 0 #fff}.follower-body-label{font-weight:800;color:#4b6864}

/* Each elite keeps its small name and health strip above its own body. */
.elite-label{position:fixed;pointer-events:none;width:180px;padding:3px 5px;background:transparent;border:0;box-shadow:none;z-index:4}.elite-label .elite-title{font-size:14px;color:#ffebb4;font-weight:1000;-webkit-text-stroke:.3px #743d35;text-shadow:1px 1px #623831,-1px -1px #623831}.elite-label .elite-countdown{font-size:9px;color:#ffdc8f;text-shadow:1px 1px #6b3d35}.elite-label .health{height:7px;border:1px solid #ffdd92;background:#5c263d99;border-radius:3px}.elite-label .health i{background:linear-gradient(90deg,#ed7154,#ffb36e)}.elite-label.mirror-hud :is(.elite-title,#boss-title){color:#ffe8f0;-webkit-text-stroke:.35px #9b2146;text-shadow:1px 1px #771f3a,-1px -1px #771f3a}.elite-label.mirror-hud .health{border-color:#ff9bbb;background:#51162b99}.elite-label.mirror-hud .health i{background:linear-gradient(90deg,#cf1659,#ff729b)}

/* Combat owns touch gestures; reading a paused modal keeps single-finger scroll. */
html,body{overscroll-behavior:none;-webkit-text-size-adjust:100%;text-size-adjust:100%}#world,#scene,#care-dock,#active-skills,#joystick,.intro,.run-banner{touch-action:none}
html,body,#world,#scene,#game-hud,#game-hud *,#active-skills,#active-skills *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
:is(input,textarea,[contenteditable]:not([contenteditable="false"]),#modal,#account-gate),#game-hud [contenteditable]:not([contenteditable="false"]) *{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}
#modal-backdrop,#modal,#modal-content{touch-action:pan-y}#modal{overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}input,textarea{font-size:16px;touch-action:manipulation}
#active-skills,#active-skills.no-skills{right:auto;bottom:auto;left:var(--skill-panel-left,18px);top:calc(var(--skill-panel-top,70vh) - env(safe-area-inset-bottom,0px));width:var(--skill-panel-width,300px);max-width:none}
#active-skill-buttons{grid-template-columns:repeat(5,minmax(0,1fr));column-gap:var(--skill-column-gap,6px);row-gap:var(--skill-row-gap,8px)}.active-skill{width:var(--skill-button-size,54px);height:var(--skill-button-size,54px)}
.skill-icon{font-size:clamp(12px,calc(var(--skill-button-size,54px)*.42),22px)}.skill-label{font-size:clamp(6px,calc(var(--skill-button-size,54px)*.17),9px)}.skill-timer{font-size:clamp(14px,calc(var(--skill-button-size,54px)*.45),24px)}
#active-skills .skill-caption{min-height:30px;margin:0 0 6px;gap:4px}#active-skills[data-viewport-compact="true"] .skill-caption{flex-wrap:wrap}
.compendium-tabs{display:flex;gap:8px;position:sticky;top:-1px;z-index:1;padding:5px 0 10px;background:#fffef0}.compendium-tabs [role="tab"]{min-width:86px;padding:9px 18px;font-size:14px;font-weight:800}.compendium-tabs [aria-selected="true"]{background:#d9f1dc;border-color:#4a7c61;color:#255039}.organ-guide-card[data-earned="false"]{background:#f1f3e9;border-style:dashed}.organ-guide-card .level-tag{font-size:10px;white-space:nowrap}.organ-guide-slot{color:#62826b}.book-card .guide-source{color:#516e61;font-size:11px}.book-card .guide-progress{color:#9b6837;font-weight:700}.guide-section-title{font-size:12px;line-height:1.5;margin:13px 0 5px;color:#31584c}.guide-strengths{display:flex;flex-wrap:wrap;gap:4px}.guide-strengths span,.guide-power-grid span{padding:4px 6px;background:#e9efdc;border-radius:5px;font-size:10px;color:#4b685b}.guide-skill-state{display:block;font-size:12px;line-height:1.6;color:#b16832}.book-card .guide-skill-meta{font-size:11px;color:#63756a}.guide-power-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
.speech-result{padding:10px 12px;border:1px solid #d5dfc7;border-radius:9px;background:#f6f7e9;margin:7px 0;font-size:12px}.speech-result summary{cursor:pointer;font-weight:700;overflow-wrap:anywhere}.speech-original{white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;font-size:13px;color:#365345}.speech-results{min-width:0}.compendium-content>button{padding:9px 12px;margin-top:9px}.compendium-tabs [role="tab"]{min-width:0;flex:1;padding:9px 10px;white-space:nowrap}@media(max-width:760px){.compendium-tabs{gap:5px}.compendium-tabs [role="tab"]{font-size:12px;padding:9px 7px}}
#mutation-burst[data-kind=island]{--notice-fill:#e5ffce;--notice-ink:#31574a;--notice-accent:#a1f4d2;--notice-accent2:#ffe3ac;--notice-accent3:#d2e8ff}#mutation-burst[data-kind=island] #burst-level{font-size:18px}@media(max-width:760px){#mutation-burst[data-kind=island] #burst-level{font-size:15px}}

.destiny-history { display: grid; gap: 8px; padding: 0; margin: 10px 0 0; list-style: none; }
.destiny-history-card { display: flex; align-items: flex-start; gap: 10px; border-inline-start: 3px solid #aa8b60; background: #f7f1e4; }
.destiny-history-order { display: grid; place-items: center; flex: 0 0 32px; height: 32px; border-radius: 50%; background: #e9d5b3; color: #4e3a43; font-size: 12px; font-weight: 900; }
.destiny-history-detail { min-width: 0; }
.destiny-history-card .destiny-history-origin { margin: 0 0 3px; color: #705338; font-size: 11px; font-weight: 700; }
@media (max-width: 560px) { .compendium-tabs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); } }

/* Locked automation gives an independent, brief flying hint; no gameplay clock. */
#flying-words.automation-lock-feedback{display:block;position:fixed;inset:0;z-index:9;pointer-events:none}
.automation-lock-notice{position:fixed;display:block;width:max-content;pointer-events:none;color:#ffe3a0;font:400 clamp(18px,2.1vw,25px)/1.25 'Be0GrowthBrush','Microsoft YaHei',sans-serif;white-space:nowrap;paint-order:stroke fill;-webkit-text-stroke:3px #503928;text-shadow:1px 3px 0 #2b292c,0 0 10px #ffc15d88;transform:translate(-50%,-100%);animation:automation-lock-fly 1.6s cubic-bezier(.12,.65,.22,1) both}
@keyframes automation-lock-fly{0%{opacity:1;transform:translate(-50%,5px) scale(.85) rotate(-5deg)}14%{opacity:1;transform:translate(-50%,-24px) scale(1.08) rotate(2deg)}32%,65%{opacity:1;transform:translate(-50%,-34px) scale(1)}100%{opacity:0;transform:translate(-44%,-92px) scale(.88) rotate(6deg)}}
.skill-automation-toggle[data-locked="true"],.skill-automation-toggle[data-locked="true"]:hover,.skill-automation-toggle[data-locked="true"]:active{background:#343e44d9;color:#e3ddc7;border-color:#c4c1ad;box-shadow:0 2px 0 #142b38a0;transform:none}
@media(prefers-reduced-motion:reduce){.automation-lock-notice{animation:none;opacity:1;transform:translate(-50%,-100%)}}

.combo-boss-reward{position:fixed;z-index:12;top:clamp(125px,27dvh,250px);left:50%;width:max-content;max-width:calc(100% - 28px);display:grid;gap:3px;text-align:center;transform:translateX(-50%);pointer-events:none;color:#fff1ac;font-weight:900;paint-order:stroke fill;-webkit-text-stroke:3px #4c2e1b;text-shadow:0 2px #492f21,0 0 12px #ffb744;animation:combo-boss-reward 3.6s both}
.combo-reward-title{font-size:clamp(14px,3.8vw,20px);letter-spacing:.09em}
.combo-reward-power{font:900 clamp(20px,5.6vw,38px)/1.25 'Microsoft YaHei UI',sans-serif;-webkit-text-stroke-width:5px}
.combo-reward-total{color:#fff8db;font-size:clamp(12px,3.4vw,17px)}
@keyframes combo-boss-reward{0%{opacity:0;transform:translate(-50%,17px) scale(.75)}8%{opacity:1;transform:translate(-50%,-4px) scale(1.06)}16%,86%{opacity:1;transform:translateX(-50%)}100%{opacity:0;transform:translate(-50%,-12px)}}
@media(prefers-reduced-motion:reduce){.combo-boss-reward{animation:none}}

#food-magnet-button{position:fixed;z-index:11;left:var(--magnet-left,12px);top:calc(var(--magnet-top,calc(100dvh - 64px)) - env(safe-area-inset-bottom,0px));min-width:82px;height:50px;display:grid;grid-template-columns:18px 1fr;align-items:center;justify-items:center;gap:0 3px;padding:3px 7px 5px;touch-action:none;overflow:hidden;border:1.5px solid #c7f4df;border-radius:12px;color:#f4ffe9;background:#254746de;box-shadow:0 2px 0 #1934399c;font-size:11px;font-weight:800;white-space:nowrap}#food-magnet-button .food-magnet-icon{grid-row:span 2;color:#f9dc8e;font-size:21px;line-height:1}#food-magnet-button small{font-size:9px;color:#bcddcd}#food-magnet-button i{position:absolute;left:0;bottom:0;width:var(--magnet-fill,0%);height:3px;background:#fae28b;pointer-events:none}#food-magnet-button:active,#food-magnet-button[aria-pressed=true]{transform:none;background:#ffedab;color:#29453b;border-color:#fff6d1}#food-magnet-button[aria-pressed=true] small,#food-magnet-button[aria-pressed=true] .food-magnet-icon{color:#647857}#food-magnet-button[aria-pressed=true] i{background:#68c899}#food-magnet-button:disabled{pointer-events:none}
#food-magnet-button,#food-magnet-button *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
@media(pointer:coarse){#food-magnet-button small{display:none}#food-magnet-button{grid-template-rows:1fr}#food-magnet-button .food-magnet-icon{grid-row:auto}}

.speech-repeat-notice{color:#e0ffe7;-webkit-text-stroke-color:#294b3e;text-shadow:1px 3px 0 #294b3e,0 0 10px #b2f3b87a}

/* The body view lives inside the scrollable compendium, away from combat FX. */
#modal.creature-inspection-modal{width:min(960px,100%);max-height:91dvh}
.creature-inspector{display:grid;grid-template-columns:minmax(0,1.56fr) minmax(215px,1fr);gap:16px;align-items:start;padding:3px 0 0}
.creature-inspector-view,.creature-inspector-info{min-width:0}
.creature-companion-controls{display:flex;align-items:center;flex-wrap:wrap;gap:7px 12px;margin:1px 0 8px}
.creature-companion-controls label{margin:0}
.creature-companion-picker{width:min(100%,280px);min-height:37px;padding:5px 28px 5px 8px;border:1px solid #7f9d89;border-radius:7px;color:#254036;background:#f4f6e8;font:inherit;font-size:16px}
.creature-companion-summary{margin-top:12px}
.creature-stage{position:relative;height:clamp(290px,50dvh,465px);overflow:hidden;isolation:isolate;border:1px solid #334f52;border-radius:14px;background:#dbe7e4;box-shadow:0 3px 0 #233e421f}
.creature-inspector-canvas{display:block;width:100%;height:100%;touch-action:pan-y;user-select:none;cursor:grab;outline-offset:-4px}
.creature-inspector-canvas:active{cursor:grabbing}
.creature-stage-title{position:absolute;left:13px;top:10px;display:grid;gap:1px;color:#2a4446;text-shadow:0 1px 2px #ffffffcc;pointer-events:none}
.creature-stage-title strong{font-size:15px;letter-spacing:.7px}.creature-stage-title small{color:#54716b;font-size:9px}
.creature-stage-status{position:absolute;top:47%;left:12px;right:12px;text-align:center;pointer-events:none;color:#365653;font-size:12px;text-shadow:0 1px 2px #ffffffbc}
.creature-hotspots{position:absolute;inset:0;pointer-events:none;z-index:2}
.creature-hotspot,.creature-hotspot:hover,.creature-hotspot:active{position:absolute;left:0;top:0;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;pointer-events:auto;touch-action:manipulation}
.creature-hotspot i{display:block;width:12px;height:12px;border:2px solid #fff9da;border-radius:50%;background:#fbb85d;box-shadow:0 0 0 3px #2c3b3eac,0 0 12px #ffd382cc;transition:background .15s,box-shadow .15s}
.creature-hotspot:hover i,.creature-hotspot[aria-pressed=true] i{background:#b6ffdc;box-shadow:0 0 0 5px #28554bd0,0 0 16px #9bffe9dd}
.creature-view-tools{display:flex;gap:6px;margin-top:9px;align-items:center}.creature-view-tools button{min-height:36px;padding:6px 10px;font-size:12px;font-weight:800}.creature-view-tools button[aria-pressed=true]{background:#d9f1dc;border-color:#4a7c61;color:#255039}.creature-reset-view{margin-left:auto}
.creature-view-hint{margin:6px 1px 2px;color:#607a6c;font-size:11px;line-height:1.4}
.creature-part-picker-label{display:block;margin:0 0 5px;font-size:11px;font-weight:800;color:#536e61}
.creature-part-picker{width:100%;min-width:0;min-height:37px;padding:5px 8px;border:1px solid #7f9d89;border-radius:7px;color:#254036;background:#f4f6e8;font:inherit;font-size:14px;touch-action:manipulation}
.creature-part-detail{min-height:124px;margin-top:10px;padding:14px;background:#f4f6e8;border:1px solid #d4dfc7;border-radius:12px;overflow-wrap:anywhere}
.creature-detail-kicker{font-size:10px;font-weight:800;letter-spacing:.6px;color:#64806e}
.creature-part-detail h3{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:6px 0;font-size:20px;line-height:1.25;color:#284b3c}.creature-part-detail .level-tag{margin:0;white-space:nowrap}
.creature-part-detail p{margin:5px 0;color:#4c6558;font-size:12px;line-height:1.65}.creature-part-detail .creature-detail-note{color:#85643a;font-size:11px}
@media(max-width:660px){#modal.creature-inspection-modal{padding:12px;max-height:calc(100dvh - 24px)}.creature-inspector{grid-template-columns:1fr;gap:8px}.creature-stage{height:clamp(215px,42dvh,356px)}.creature-stage-title strong{font-size:13px}.creature-part-detail{min-height:100px;padding:11px}.creature-part-detail h3{font-size:17px}.creature-view-tools button{min-height:34px}.creature-part-picker{font-size:16px}}

.wind-notice{color:#d2ffe4;-webkit-text-stroke-color:#2b5b50;text-shadow:1px 3px 0 #254a47,0 0 12px #c2ffebad}

/* A page-owned menu can preview the model before committing the selection. */
.creature-picker-shell{position:relative;min-width:0;z-index:3}
.creature-part-picker{position:relative;display:block;text-align:left;padding-right:32px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.creature-part-picker::after{content:'⌄';position:absolute;right:10px;top:50%;transform:translateY(-54%);color:#4b6c5c;font-size:16px}
.creature-part-picker[aria-expanded=true]{border-color:#bc5160;box-shadow:0 0 0 2px #dc55601b}
.creature-part-options{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:3;max-height:min(330px,42dvh);overflow:auto;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-width:thin;padding:4px;background:#fffef5;border:1px solid #9eac94;border-radius:10px;box-shadow:0 5px 18px #20393331}
.creature-option-heading{display:block;padding:7px 9px 4px;color:#6b7e70;font-size:10px;font-weight:800}
.creature-part-option{position:relative;min-height:32px;display:flex;align-items:center;white-space:nowrap;overflow:hidden;padding:7px 10px;border-left:3px solid transparent;border-radius:5px;color:#2b473c;font-size:13px;line-height:1.25;cursor:pointer;user-select:none;touch-action:pan-y}
.creature-part-option[aria-selected=true]{font-weight:800;background:#e9f1e2}.creature-part-option[data-active=true]{background:#fce4e4;border-left-color:#dc465b;color:#682e38}
.creature-part-mark{position:absolute;left:9px;bottom:8px;max-width:calc(100% - 18px);padding:4px 8px;border:1px solid #dc8993;border-radius:6px;background:#fff3efe8;color:#74333d;font-size:10px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.creature-hotspot[data-highlighted=true] i{background:#ff6072;border-color:#fff5e7;box-shadow:0 0 0 4px #823447a3,0 0 13px #ff6072bd}
@media(max-width:660px){
 .creature-inspector.browsing-parts .creature-stage{height:clamp(124px,29dvh,248px)}
 .creature-inspector.browsing-parts .creature-view-tools,.creature-inspector.browsing-parts .creature-view-hint,.creature-inspector.browsing-parts .creature-part-detail{display:none}
 .creature-part-options{position:relative;top:auto;max-height:clamp(100px,29dvh,238px);margin-top:4px;box-shadow:none}
 .creature-part-option{min-height:38px;font-size:14px}
}
/* Shared top HUD: only interactive controls intercept a move gesture. */
.game-hud {
  --hud-ink: #172e2b;
  --hud-muted: #25453c;
  --hud-accent: #60361c;
  --hud-rule: #25453c60;
  --hud-track: #25453c46;
  --hud-health: #276b53;
  --hud-meter: #a15827;
  --hud-hover: #fffbe84f;
  --hud-halo: 0 1px 2px #fff8e2bc;
  --hud-gutter: clamp(8px, 1.7vw, 24px);
  position: fixed;
  top: max(8px, env(safe-area-inset-top, 0px));
  right: max(var(--hud-gutter), env(safe-area-inset-right, 0px));
  left: max(var(--hud-gutter), env(safe-area-inset-left, 0px));
  z-index: 5;
  color: var(--hud-ink);
  text-shadow: var(--hud-halo);
  pointer-events: none;
}
.game-hud[data-tone='night'] {
  --hud-ink: #fff8e8;
  --hud-muted: #edf2e7;
  --hud-accent: #ffdb9e;
  --hud-rule: #fff8e873;
  --hud-track: #e2e9e25c;
  --hud-health: #a1dfb6;
  --hud-meter: #ffd48b;
  --hud-hover: #1b302f63;
  --hud-halo: 0 1px 3px #102631;
}

.topbar {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content minmax(0, 1fr);
  grid-template-areas: 'brand counters actions';
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.brand {
  grid-area: brand;
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 8px;
}
.brand .share-cover-first {
  position: static;
  flex: none;
  width: 33px;
  height: 33px;
  opacity: 1;
  object-fit: cover;
  border: 1px solid var(--hud-rule);
  border-radius: 7px;
}
.brand-copy { display: grid; min-width: 0; gap: 2px; }
.brand-copy strong { font-size: 21px; line-height: 1.05; letter-spacing: .03em; }
.brand-copy small { color: var(--hud-muted); font-size: 10px; line-height: 1.2; overflow-wrap: anywhere; }
.brand .version {
  flex: none;
  color: var(--hud-muted);
  font-size: 10px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.run-counters {
  grid-area: counters;
  display: grid;
  grid-template-columns: repeat(4, minmax(52px, 1fr));
  align-items: stretch;
  font-variant-numeric: tabular-nums;
}
.run-counter,.combo-slot {
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 2px;
  min-width: 0;
  padding: 0 8px;
  border-inline-start: 1px solid var(--hud-rule);
  text-align: center;
  white-space: nowrap;
}
.run-counter:first-child { border-inline-start: 0; }
.combo-slot:has(#combo[hidden]) { border-inline-start-color: transparent; }
.run-counter b,#combo-count { font-size: 17px; line-height: 1.05; font-weight: 850; }
.run-counter small,.combo small { color: var(--hud-muted); font-size: 10px; line-height: 1.15; }
.combo { display: flex; flex-direction: column; align-items: center; gap: 2px; }
#combo-count { color: var(--hud-accent); }

.hud-nav { grid-area: actions; justify-self: end; display: flex; align-items: center; gap: 5px; }
.hud-nav button,.hud-menu > summary,.diet-heading button,#speech-toggle,#say-button,#speech-hints button {
  pointer-events: auto;
  touch-action: manipulation;
  white-space: nowrap;
}
.hud-nav > button,.hud-menu > summary {
  display: grid;
  place-items: center;
  min-width: 36px;
  min-height: 36px;
  padding: 4px 8px;
  color: var(--hud-ink);
  background: transparent;
  border: 1px solid var(--hud-rule);
  border-radius: 6px;
  font-size: 12px;
  font-weight: 800;
  text-shadow: inherit;
}
.hud-nav > button:hover,.hud-menu > summary:hover,.hud-menu[open] > summary { background: var(--hud-hover); }
.hud-nav > #pause-button { font-size: 15px; }
.hud-menu { position: relative; margin: 0; }
.hud-menu > summary { cursor: pointer; list-style: none; }
.hud-menu > summary::-webkit-details-marker { display: none; }
.hud-menu-items {
  position: absolute;
  top: calc(100% + 7px);
  right: 0;
  display: grid;
  gap: 5px;
  width: min(174px, 70vw);
  max-height: min(340px, 75dvh);
  overflow: auto;
  padding: 7px;
  color: #192e2c;
  background: #f8f3e4;
  border: 1px solid #728178;
  border-radius: 8px;
  box-shadow: 0 6px 18px #182b2b57;
  pointer-events: auto;
  touch-action: pan-y;
  text-shadow: none;
}
.hud-menu:not([open]) .hud-menu-items { display: none; }
.hud-menu-version {
  padding: 2px 4px 6px;
  border-bottom: 1px solid #bdc8bb;
  color: #2b4940;
  font-size: 11px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.hud-menu-items button {
  display: block;
  min-height: 34px;
  padding: 4px 7px;
  color: inherit;
  background: #fffdf5;
  border: 1px solid #a5b4a5;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 750;
  text-align: start;
}
.hud-menu-items button:hover,.hud-menu-items button[aria-pressed='true'] { background: #dceadd; }
.hud-menu-items button[aria-pressed='true']::after { content: '✓'; float: right; color: #284d42; }
#save-status { padding: 3px 4px; color: #40574e; font-size: 11px; line-height: 1.3; overflow-wrap: anywhere; }
.hud-nav > button:focus-visible,.hud-menu > summary:focus-visible { outline: 2px solid var(--hud-ink); outline-offset: 2px; }

.hud-dashboard {
  position: relative;
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr) minmax(210px, 252px);
  grid-template-areas: 'journey care diet';
  align-items: start;
  gap: 9px;
  margin-top: 5px;
}
.hud-status,.care-dock { min-width: 0; }
.hud-status { display: grid; gap: 4px; font-variant-numeric: tabular-nums; }
.journey { grid-area: journey; }
.journey-main { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 7px; }
.map-wrap { display: grid; justify-items: center; align-content: center; gap: 2px; min-width: 0; }
.map-wrap canvas {
  display: block;
  width: 44px;
  height: 44px;
  background: #27433b;
  border: 1px solid #455e53;
  border-radius: 50%;
}
#height-label { color: var(--hud-muted); font-size: 9px; line-height: 1.15; text-align: center; }
.journey-status { display: grid; gap: 4px; min-width: 0; }
#region-label { color: var(--hud-muted); font-size: 11px; line-height: 1.2; font-weight: 750; overflow-wrap: anywhere; }
.life-row { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 5px; line-height: 1.1; }
.life-row strong { font-size: 14px; font-weight: 850; }
#hp-label { color: var(--hud-ink); font-size: 11px; font-weight: 750; white-space: nowrap; }
.journey .health { height: 5px; border: 0; background: var(--hud-track); }
.journey .health i { background: var(--hud-health); }
.island-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 7px; color: var(--hud-muted); font-size: 10px; line-height: 1.2; }
#dominance-stat { color: var(--hud-ink); font-weight: 800; white-space: nowrap; }
#weather-clock { font-weight: 720; overflow-wrap: anywhere; }
#weather-clock[data-wind='true'] { color: var(--hud-accent); }
#island-route { margin: 0; color: var(--hud-muted); font-size: 11px; font-weight: 750; line-height: 1.3; white-space: pre-line; overflow-wrap: anywhere; }

.diet { grid-area: diet; }
.diet-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px; }
.diet-heading #book-button {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px 5px;
  min-width: 0;
  padding: 1px 0;
  color: var(--hud-ink);
  background: transparent;
  border: 0;
  border-radius: 4px;
  text-align: start;
  text-shadow: inherit;
}
#book-button span { color: var(--hud-muted); font-size: 11px; font-weight: 750; }
#total-food { color: var(--hud-ink); font-size: 23px; line-height: 1; font-weight: 850; white-space: normal; overflow-wrap: anywhere; }
#food-guide-button,#speech-toggle,#say-button {
  min-height: 32px;
  padding: 4px 7px;
  color: var(--hud-ink);
  background: transparent;
  border: 1px solid var(--hud-rule);
  border-radius: 5px;
  font-size: 12px;
  font-weight: 800;
  box-shadow: none;
  text-shadow: inherit;
}
#food-guide-button:hover,#speech-toggle:hover,#say-button:hover { background: var(--hud-hover); }
.diet-meta,.batch-row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 2px 6px; font-size: 11px; line-height: 1.22; }
.diet-meta { color: var(--hud-muted); }
.diet-meta #organ-count { color: inherit; font-style: normal; }
.batch-row b { color: var(--hud-ink); font-weight: 800; white-space: nowrap; }
.batch-track,#diet-ratio { display: flex; height: 4px; background: var(--hud-track); border-radius: 4px; overflow: hidden; }
.batch-track i { display: block; width: 0; height: 100%; background: var(--hud-meter); transition: width .4s; }
#diet-ratio { height: 3px; background: none; }
#diet-ratio i { display: block; transition: width .3s; }

.care-dock { grid-area: care; justify-self: center; width: min(100%, 420px); }
.reply { display: flex; align-items: center; gap: 7px; min-width: 0; }
.reply p { margin: 0; padding-right: 3px; min-width: 0; color: var(--hud-muted); font-size: 11px; font-weight: 650; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.care-dock.expanded .reply p { white-space: normal; overflow-wrap: anywhere; }
#speech-form,#speech-hints { display: none; }
.care-dock.expanded #speech-form,.care-dock.expanded #speech-hints { display: flex; gap: 5px; margin-top: 5px; }
#speech-input { flex: 1; min-width: 0; min-height: 36px; padding: 5px 7px; border: 1px solid #85988a; border-radius: 5px; background: #fffdf5f2; font-size: 16px; color: #192e2c; pointer-events: auto; touch-action: manipulation; }
#speech-input::placeholder { color: #586a62; opacity: 1; }
#speech-hints { flex-wrap: wrap; align-items: center; color: var(--hud-muted); font-size: 10px; }
#speech-hints button { min-height: 29px; padding: 3px 6px; color: var(--hud-ink); background: transparent; border: 1px solid var(--hud-rule); border-radius: 4px; font-size: 11px; text-shadow: inherit; }
#speech-hints small { font-size: 10px; }
.hud-dashboard :is(button,input):focus-visible { outline: 2px solid var(--hud-ink); outline-offset: 1px; }

@media (max-width: 760px) {
  .topbar { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: 'brand actions' 'counters counters'; gap: 2px 7px; }
  .brand { gap: 5px; }
  .brand .share-cover-first { width: 29px; height: 29px; }
  .brand-copy strong { font-size: 16px; }
  .brand-copy small { font-size: 9px; }
  .run-counters { grid-template-columns: repeat(4, minmax(0, 1fr)); padding-block: 3px; }
  .run-counter,.combo-slot,.combo { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 2px 4px; }
  .run-counter,.combo-slot { padding: 0 3px; }
  .combo { flex-direction: row; }
  .run-counter b,#combo-count { font-size: 14px; }
  .hud-dashboard { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: 'journey diet' 'care care'; align-items: start; gap: 5px 11px; margin-top: 3px; }
  .hud-status { gap: 3px; }
  .journey-main { gap: 3px 5px; }
  .journey-status { display: contents; }
  .map-wrap { grid-column: 1; grid-row: 1 / 4; width: 35px; }
  .map-wrap canvas { width: 34px; height: 34px; }
  #height-label { display: none; }
  .island-meta { grid-column: 1 / -1; }
  #region-label,#hp-label { font-size: 10px; }
  .life-row strong { font-size: 12px; }
  .island-meta,#island-route { font-size: 10px; }
  #book-button span,.diet-meta,.batch-row { font-size: 10px; }
  #total-food { font-size: 19px; }
  #food-guide-button,#speech-toggle,#say-button { min-height: 34px; padding-inline: 6px; font-size: 11px; }
  .care-dock { width: 100%; }
}

@media (max-width: 455px) {
  .brand .version { display: none; }
  .hud-nav { gap: 4px; }
  .hud-nav > button,.hud-menu > summary { padding-inline: 6px; }
}

@media (orientation: landscape) and (max-height: 480px) {
  .game-hud { top: max(5px, env(safe-area-inset-top, 0px)); }
  .topbar { grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: 'brand counters actions'; gap: 6px; }
  .brand .version { display: none; }
  .run-counters { grid-template-columns: repeat(4, minmax(35px, 1fr)); padding: 0; border: 0; }
  .run-counter,.combo-slot,.combo { display: grid; align-items: center; gap: 2px; }
  .run-counter,.combo-slot { padding: 0 4px; }
  .hud-dashboard { grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr) minmax(0, .92fr); grid-template-areas: 'journey care diet'; align-items: start; gap: 5px; margin-top: 5px; }
  .hud-status { gap: 3px; }
  .journey-main { gap: 3px 5px; }
  .journey-status { display: contents; }
  .map-wrap { grid-column: 1; grid-row: 1 / 4; width: 35px; }
  .map-wrap canvas { width: 34px; height: 34px; }
  #height-label { display: none; }
  .island-meta { grid-column: 1 / -1; }
  #speech-hints > span { display: none; }
  #pause-indicator { top: 50%; }
}

#modal.be0-board-modal {
  width: min(820px, 100%);
}

.be0-board {
  --board-ink: #203e39;
  --board-muted: #53695c;
  --board-line: #d7ddbd;
  color: var(--board-ink);
  font-variant-numeric: tabular-nums;
}

.be0-board-hero {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  overflow: hidden;
  padding: clamp(14px, 3.3vw, 27px);
  background: radial-gradient(ellipse at 83% 100%, #54795b, transparent 60%), #244741;
  border: 1px solid #23423a;
  border-radius: 14px;
  color: #fff4d6;
}

.be0-board-hero::before,
.be0-board-hero::after {
  position: absolute;
  z-index: -1;
  content: '';
  pointer-events: none;
}

.be0-board-hero::before {
  width: 58%;
  height: 230%;
  right: -12%;
  bottom: -118%;
  transform: rotate(-32deg);
  border: 1px solid #e4efb04d;
  border-radius: 50%;
  box-shadow: 0 0 0 12px #e4efb01f, 0 0 0 24px #e4efb013;
}

.be0-board-hero::after {
  inset: 28% 0 0 59%;
  background: #93a97155;
  clip-path: polygon(0 100%, 26% 56%, 43% 65%, 65% 27%, 79% 52%, 100% 0, 100% 100%);
}

.be0-board-heading { min-width: 0; }
.be0-board-kicker { font-size: 10px; color: #e6d597; font-weight: 800; letter-spacing: .15em; }
.be0-board-hero h3 { margin: .2em 0 .28em; font-size: clamp(23px, 5vw, 38px); font-weight: 1000; line-height: 1.1; }
.be0-board-rule { margin: 0; font-size: 12px; line-height: 1.55; color: #f4f0d1; }
.be0-board-reload { flex-shrink: 0; padding: 7px 10px; color: #fdf2cd; border-color: #eddfa46e; background: #193c37; font-size: 12px; }
.be0-board-reload:hover { color: #25443b; background: #f9ebba; }
.be0-board-status { margin: 12px 0 0; padding: 20px 12px; text-align: center; border-radius: 10px; background: #f0f1d9; color: var(--board-muted); font-size: 13px; }

.be0-board-podium {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.14fr) minmax(0, 1fr);
  grid-template-areas: 'silver gold bronze';
  align-items: end;
  gap: clamp(6px, 2vw, 13px);
  list-style: none;
  margin: 23px 0 16px;
  padding: 0;
}

.be0-board-podium[data-count='1'] {
  grid-template-columns: minmax(0, min(100%, 290px));
  grid-template-areas: 'gold';
  justify-content: center;
}

.be0-board-podium[data-count='2'] {
  grid-template-columns: repeat(2, minmax(0, min(50%, 265px)));
  grid-template-areas: 'gold silver';
  justify-content: center;
}

.be0-board-card {
  --medal-light: #e6e9de;
  --medal-dark: #647d75;
  --medal-glow: #b4d4ca;
  --medal-ink: #253f3a;
  --medal-sky: #365d58;
  position: relative;
  isolation: isolate;
  min-width: 0;
  background: #f2f2dc;
  border: 1px solid var(--medal-dark);
  border-radius: 12px;
  box-shadow: 0 3px 0 #31554929;
}

.be0-board-card[data-rank='1'] {
  --medal-light: #ffdf82;
  --medal-dark: #a66a27;
  --medal-glow: #e9bd61;
  --medal-ink: #56371b;
  --medal-sky: #445135;
  grid-area: gold;
  background: #fff4d2;
  box-shadow: 0 4px 0 #ab6b4247, 0 4px 19px #ad763120;
}

.be0-board-card[data-rank='2'] { grid-area: silver; }
.be0-board-card[data-rank='3'] {
  --medal-light: #f6c696;
  --medal-dark: #9a6953;
  --medal-glow: #dbad87;
  --medal-ink: #4d352e;
  --medal-sky: #554945;
  grid-area: bronze;
  background: #f6ead8;
}

.be0-board-medal {
  position: absolute;
  z-index: 2;
  top: -10px;
  left: 8px;
  display: grid;
  width: clamp(26px, 5.6vw, 43px);
  height: clamp(33px, 7vw, 54px);
  place-items: start center;
  padding-top: .15em;
  background: linear-gradient(135deg, #fff6ca, var(--medal-light) 42%, var(--medal-dark));
  color: var(--medal-ink);
  clip-path: polygon(14% 0, 86% 0, 100% 15%, 100% 74%, 50% 100%, 0 74%, 0 15%);
  font: 950 clamp(18px, 3.4vw, 29px)/1.16 system-ui, sans-serif;
  text-shadow: 0 1px 1px #fff8d58c;
}

.be0-board-card[data-rank='1'] .be0-board-medal {
  left: 50%;
  top: -14px;
  transform: translateX(-50%);
}

.be0-board-stage {
  position: relative;
  isolation: isolate;
  display: grid;
  width: 100%;
  aspect-ratio: 1.24;
  place-items: center;
  overflow: hidden;
  border-radius: 11px 11px 0 0;
  background: radial-gradient(ellipse at 50% 62%, var(--medal-glow), transparent 72%), var(--medal-sky);
}

.be0-board-card[data-rank='1'] .be0-board-stage { aspect-ratio: 1.1; }
.be0-board-stage::before,
.be0-board-stage::after {
  position: absolute;
  z-index: -1;
  content: '';
  pointer-events: none;
}

.be0-board-stage::before {
  inset: 9% 13% 0;
  border: 1px solid #fff7d685;
  border-radius: 50%;
  box-shadow: inset 0 0 0 7px #fff7d621, 0 0 0 4px #fff7d616;
}

.be0-board-stage::after {
  right: 0;
  bottom: 0;
  left: 0;
  height: 26%;
  background: linear-gradient(#cdd1a0 0 18%, #849870 18% 52%, #536e58 52% 100%);
  clip-path: polygon(0 94%, 18% 36%, 31% 35%, 45% 9%, 61% 14%, 71% 41%, 83% 45%, 100% 87%, 100% 100%, 0 100%);
}

.be0-board-portrait {
  display: block;
  width: 100%;
  height: auto;
  margin: -2% 0 0;
  filter: drop-shadow(0 3px 2px #172e2a7d);
  pointer-events: none;
}

.be0-board-silhouette {
  position: relative;
  display: block;
  width: 57%;
  aspect-ratio: 1.28;
  margin-bottom: 9%;
  opacity: .82;
  background: var(--medal-ink);
  clip-path: polygon(5% 48%, 22% 34%, 27% 9%, 44% 28%, 63% 26%, 82% 10%, 83% 33%, 97% 50%, 86% 79%, 69% 92%, 58% 79%, 40% 83%, 30% 98%, 15% 79%);
}

.be0-board-silhouette::after {
  position: absolute;
  inset: 43% 22% 45% 37%;
  content: '';
  background: #fff3cb;
  clip-path: polygon(0 15%, 44% 49%, 100% 2%, 77% 88%, 49% 92%, 23% 77%);
}

.be0-board-portrait-status {
  position: absolute;
  inset: auto 5% 5%;
  justify-self: center;
  padding: 2px 6px;
  border-radius: 4px;
  background: #18332bd9;
  color: #fff3cb;
  font-size: clamp(9px, 2.1vw, 11px);
  text-align: center;
  line-height: 1.3;
}

.be0-board-card-footer { display: grid; justify-items: center; gap: 3px; min-width: 0; padding: 7px 5px 9px; text-align: center; }
.be0-board-place { margin: 0; font-size: 11px; font-weight: 800; color: var(--medal-ink); }
.be0-board-name { min-width: 0; overflow-wrap: anywhere; font-size: inherit; line-height: 1.24; }
.be0-board-card-footer > .be0-board-name,
.be0-board-card-footer > .be0-board-identity { max-width: 100%; font-size: clamp(11px, 3.1vw, 18px); }
.be0-board-card-footer .be0-board-name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.be0-board-identity { display: inline-flex; align-items: baseline; gap: 5px; min-width: 0; max-width: 100%; }
.be0-board-own { flex: 0 0 auto; padding: 1px 4px; background: #d6ead1; border-radius: 5px; color: #28583d; font-size: 10px; font-weight: 800; }
.be0-board-food { font-size: clamp(12px, 3.7vw, 23px); color: var(--medal-ink); }
.be0-board-card-kills { color: var(--board-muted); font-size: 10px; }

.be0-board-list-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin: 16px 0 5px;
  padding: 0 2px;
}

.be0-board-list-head h3 { margin: 0; font-size: 17px; }
.be0-board-list-head span { color: var(--board-muted); font-size: 11px; white-space: nowrap; }
.be0-board-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 13px; }
.be0-board-table :is(th,td) { padding: 8px 6px; border-bottom: 1px solid var(--board-line); text-align: right; overflow-wrap: anywhere; }
.be0-board-table :is(th,td):first-child { width: 11%; text-align: center; }
.be0-board-table :is(th,td):nth-child(2) { width: 44%; text-align: left; }
.be0-board-table :is(th,td):last-child { width: 25%; padding-right: 8px; font-weight: 900; color: #284e42; }
.be0-board-table thead { color: var(--board-muted); background: #e8eed4; }
.be0-board-table tbody tr:nth-child(even) { background: #f4f5df; }
.be0-board-table tbody tr[data-self='true'] { background: #dcebd0; }
.be0-board-rank { color: #587367; }

@media (max-width: 440px) {
  #modal.be0-board-modal { padding: 12px; }
  .be0-board-hero { gap: 7px; padding: 12px; }
  .be0-board-rule { font-size: 11px; }
  .be0-board-reload { padding: 6px 8px; font-size: 11px; }
  .be0-board-card-footer { min-height: 80px; align-content: start; }
  .be0-board-place { font-size: 10px; }
  .be0-board-table { font-size: 11px; }
  .be0-board-table :is(th,td) { padding: 7px 3px; }
}

.book-card .guide-skill-heading{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:7px}
.guide-skill-icon{display:grid;place-items:center;width:30px;height:30px;border:1.5px solid #24484b;border-radius:50%;background:var(--skill-color);box-shadow:inset 0 0 0 2px #fffc;color:#fff;font-size:17px;font-weight:900;line-height:1;text-shadow:0 1px 2px #243743}
.guide-skill-name{overflow-wrap:anywhere}
.speech-keyword-title{display:block;margin-top:8px;color:#573875;font-size:12px;line-height:1.4}
.speech-keyword-chips{display:flex;flex-wrap:wrap;gap:5px;list-style:none;margin:4px 0 7px;padding:0}
.speech-keyword-chips li{max-width:100%;padding:4px 8px;border:1px solid #cdb8e0;border-radius:5px;background:#f1e6fa;color:#422a60;font-size:14px;font-weight:800;line-height:1.3;overflow-wrap:anywhere}

/* 天命抉择 */
#destiny-choice {
  width: min(780px, calc(100vw - 28px));
  max-width: none;
  max-height: min(92dvh, 680px);
  padding: 0;
  border: 1px solid #8d9eb6;
  border-radius: 22px;
  color: #f4f5ff;
  background: #141728;
  box-shadow: 0 24px 90px #020411c9, 0 0 38px #a5bbff37;
  overscroll-behavior: contain;
  overflow-x: hidden;
}
#destiny-choice:not([open]) { display: none; }
#destiny-choice[open] { animation: destiny-panel-enter .32s cubic-bezier(.2,.7,.22,1); }
#destiny-choice::backdrop { background: #090d20bc; animation: destiny-backdrop-enter .24s ease-out; }
#destiny-choice, #destiny-choice * { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.destiny-shell {
  padding: clamp(20px, 4vw, 39px);
  background:
    repeating-linear-gradient(132deg, #bcc9ff06 0 1px, transparent 1px 7px),
    radial-gradient(ellipse at 50% -10%, #72508563, transparent 58%),
    linear-gradient(140deg, #212a43, #141728 60%, #1b192e);
}
.destiny-header { margin: 0 0 clamp(16px, 3vw, 27px); text-align: center; }
.destiny-header span {
  display: inline-block;
  padding: 4px 12px;
  border: 1px solid #92a2c256;
  border-radius: 99px;
  color: #d2dbf0;
  font-size: 12px;
  letter-spacing: .14em;
}
.destiny-header h2 {
  margin: 9px 0 0;
  color: #fff5d7;
  font-size: clamp(30px, 6vw, 53px);
  line-height: 1.06;
  letter-spacing: .13em;
  text-shadow: 0 0 24px #ffc66b59, 2px 3px 0 #3c304f;
}
.destiny-header h2::after {
  content: "";
  display: block;
  width: min(200px, 55%);
  height: 7px;
  margin: 10px auto 0;
  background:
    linear-gradient(45deg, #ebc88e 50%, transparent 50%) center / 6px 6px no-repeat,
    linear-gradient(90deg, transparent, #d7ba92b5 50%, transparent) center / 100% 1px no-repeat;
  transform: scaleX(1.12);
}
#destiny-instruction {
  margin: 9px 0 0;
  color: #ffe0ab;
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: .1em;
}
.destiny-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; }
.destiny-card {
  --destiny-accent: #8bf4e8;
  --destiny-surface: #244f61;
  --destiny-glow: #65c9bf47;
  --destiny-entry-x: -20px;
  --destiny-entry-angle: -2.5deg;
  --destiny-card-background:
    radial-gradient(ellipse at 50% -18%, var(--destiny-glow), transparent 68%),
    linear-gradient(90deg, #0b122229, #0b1222cc 43%, #0b1222cc 57%, #0b122229),
    url("./assets/ui/destiny-slate.jpg") center / cover no-repeat,
    #141c2a;
  position: relative;
  isolation: isolate;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 190px;
  padding: 17px clamp(14px, 2vw, 22px);
  border: 1px solid var(--destiny-accent);
  border-radius: 12px;
  color: #fff;
  background: var(--destiny-card-background);
  box-shadow: 0 4px 0 #040a17, inset 0 0 20px #030715d9;
  text-align: center;
  touch-action: manipulation;
  animation: destiny-card-enter .35s cubic-bezier(.2,.7,.2,1) both;
}
.destiny-card:nth-child(2) {
  --destiny-accent: #ffd68d;
  --destiny-surface: #664b46;
  --destiny-glow: #e5a85c46;
  --destiny-entry-x: 20px;
  --destiny-entry-angle: 2.5deg;
  animation-delay: .055s;
}
.destiny-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 7px auto 7px 0;
  width: clamp(58px, 23%, 108px);
  background: url("./assets/mystery/mystery31.webp") left 46% / 122% auto no-repeat;
  mask-image: linear-gradient(90deg, #000 25%, #0007 66%, transparent);
  filter: saturate(.65) brightness(1.55);
  opacity: .48;
  pointer-events: none;
}
.destiny-card:nth-child(2)::before {
  inset: 7px 0 7px auto;
  transform: scaleX(-1);
  filter: sepia(.75) hue-rotate(-19deg) saturate(1.2) brightness(1.47);
}
.destiny-card::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 5px;
  border: 1px solid var(--destiny-accent);
  border-radius: 8px;
  clip-path: polygon(0 0, 22% 0, 13% 18%, 87% 18%, 78% 0, 100% 0, 100% 100%, 78% 100%, 87% 82%, 13% 82%, 22% 100%, 0 100%);
  opacity: .48;
  pointer-events: none;
}
.destiny-card:enabled:hover, .destiny-card:focus-visible {
  color: #fff;
  background: var(--destiny-card-background);
  box-shadow: 0 0 19px var(--destiny-surface), inset 0 0 22px var(--destiny-surface);
}
.destiny-card:focus-visible { outline: 2px solid var(--destiny-accent); outline-offset: 2px; }
.destiny-card[aria-pressed="true"] {
  box-shadow: 0 0 0 2px var(--destiny-accent), 0 0 24px var(--destiny-glow), inset 0 0 20px var(--destiny-surface);
}
.destiny-picked {
  position: absolute;
  top: 9px;
  right: 10px;
  display: none;
  color: var(--destiny-accent);
  font-size: 11px;
  font-weight: 800;
}
.destiny-card[aria-pressed="true"] .destiny-picked { display: block; }
.destiny-actions { display: flex; justify-content: center; margin-top: clamp(12px, 3vw, 22px); }
.destiny-confirm {
  min-width: min(220px, 100%);
  min-height: 44px;
  border: 1px solid #ffe4a8;
  border-radius: 9px;
  color: #2e2435;
  background: linear-gradient(110deg, #ffefb7, #e9b96e);
  font-weight: 900;
  touch-action: manipulation;
  animation: destiny-confirm-enter .23s ease-out .1s both;
}
.destiny-confirm:disabled { opacity: .42; pointer-events: none; }
.destiny-confirm:focus-visible { outline: 2px solid #fff5d7; outline-offset: 3px; }
.destiny-emblem {
  width: 42px;
  height: 42px;
  position: relative;
  display: grid;
  place-items: center;
  color: var(--destiny-accent);
}
.destiny-emblem::before, .destiny-emblem::after { content: ""; position: absolute; }
.destiny-emblem::before {
  inset: 3px;
  border: 1px solid currentColor;
  border-radius: 50%;
  box-shadow: 0 0 14px var(--destiny-surface);
}
.destiny-emblem::after {
  width: 17px;
  height: 17px;
  border: 1px solid currentColor;
  transform: rotate(45deg);
  background: radial-gradient(circle, #fff 0%, currentColor 14%, transparent 50%);
  box-shadow: 0 0 12px currentColor;
}
.destiny-emblem b { z-index: 1; color: #fff; font-size: 13px; text-shadow: 0 1px 4px #0b1225; }
.destiny-card:nth-child(2) .destiny-emblem::before { inset: 5px; border-radius: 3px; transform: rotate(45deg); }
.destiny-card:nth-child(2) .destiny-emblem::after { border-radius: 50%; }
.destiny-name { color: var(--destiny-accent); font-size: clamp(18px, 3vw, 26px); line-height: 1.2; text-shadow: 0 2px 5px #050715; }
.destiny-effect { color: #edf1fb; font-size: clamp(12px, 2vw, 15px); line-height: 1.55; text-shadow: 0 2px 4px #050715; }
@keyframes destiny-panel-enter {
  from { opacity: .66; transform: translateY(12px) scale(.96); }
  70% { opacity: 1; transform: translateY(-2px) scale(1.008); }
}
@keyframes destiny-backdrop-enter { from { opacity: .3; } }
@keyframes destiny-card-enter {
  from { opacity: .68; transform: translate(var(--destiny-entry-x), 10px) rotate(var(--destiny-entry-angle)) scale(.97); }
  65% { opacity: 1; transform: translateY(-3px) scale(1.012); filter: brightness(1.18); }
}
@keyframes destiny-confirm-enter { from { transform: translateY(7px) scale(.97); } }
#player-display-name.destiny-rainbow { color: #a24090; }
@supports ((background-clip: text) or (-webkit-background-clip: text)) {
  #player-display-name.destiny-rainbow {
    background: linear-gradient(100deg,#a72b53,#a94c13,#427621,#167476,#5d3ca9,#a72b53);
    background-size: 200% 100%;
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    animation: destiny-rainbow 3s linear infinite;
  }
}
@keyframes destiny-rainbow { to { background-position: -200% 0; } }
@media (max-width: 520px) and (orientation: portrait) {
  .destiny-options { grid-template-columns: minmax(0,1fr); }
  .destiny-card { --destiny-entry-x: -10px; min-height: 140px; gap: 6px; padding: 12px 14px; }
  .destiny-card:nth-child(2) { --destiny-entry-x: 10px; }
  .destiny-emblem { width: 32px; height: 32px; }
  .destiny-emblem::after { width: 12px; height: 12px; }
}
@media (max-height: 410px) and (orientation: landscape) {
  .destiny-shell { padding: 12px 17px 15px; }
  .destiny-header { margin-bottom: 11px; }
  .destiny-header h2 { margin-top: 5px; font-size: 30px; }
  .destiny-card { min-height: 120px; gap: 6px; padding: 9px 13px; }
  .destiny-emblem { width: 30px; height: 30px; }
  .destiny-emblem::after { width: 12px; height: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  #destiny-choice[open], #destiny-choice::backdrop, .destiny-card, .destiny-confirm,
  #player-display-name.destiny-rainbow { animation: none; }
}
.visual-style-options { display: flex; gap: 6px; margin: 10px 0 12px; }
.visual-style-options button { flex: 1; min-height: 44px; padding: 6px 10px; font-size: 13px; font-weight: 700; }
.visual-style-options button[aria-pressed='true'], #account-gate .visual-style-options button[aria-pressed='true'] { background: #263c3b; border-color: #263c3b; color: #fff8df; }
html:is([data-visual-style='pixel'],[data-visual-style='fine']) .visual-style-options button[aria-pressed='true'],
html:is([data-visual-style='pixel'],[data-visual-style='fine']) #hud-menu #visual-style-button { background: #25534b; color: #fff6d2; border-radius: 2px; box-shadow: inset 0 -3px #183c3c; }
html:is([data-visual-style='pixel'],[data-visual-style='fine']) :is(.journey,.run-counter,.combo,.hud-menu-items,.active-skill-button,.boss-hud){border-radius:3px}
html:is([data-visual-style='pixel'],[data-visual-style='fine']) .game-hud{--hud-ink:#fff8e8;--hud-muted:#ecf4e1;--hud-accent:#ffe2a2;--hud-rule:#dcf4dd80;--hud-track:#d5eddb50;--hud-health:#a3efb2;--hud-meter:#ffbb68;--hud-hover:#1b302f83;--hud-halo:1px 1px 0 #123841,-1px -1px 0 #123841,0 1px 4px #102631}

#modal.quick-guide-modal { width: min(640px, 100%); border-radius: 8px; }
.quick-guide-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.quick-guide-card { position: relative; display: grid; grid-template-rows: auto 1fr; overflow: hidden; border: 1px solid #28463f; border-radius: 5px; background: #142923; }
.quick-guide-card::before { content: ''; aspect-ratio: 2 / 1; }
.quick-guide-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.quick-guide-caption { position: relative; margin-top: -30px; padding: 14px 12px 11px; background: linear-gradient(180deg, transparent, #142923f5 14px, #142923 40px); }
.quick-guide-card h3 { display: flex; align-items: center; gap: 6px; margin: 0 0 4px; color: #fff1af; font-size: 17px; line-height: 1.25; }
.quick-guide-icon { display: grid; place-items: center; width: 23px; height: 23px; border: 1px solid #84936c; border-radius: 3px; background: #355b50; color: #fff1af; font-size: 15px; }
.quick-guide-card p { margin: 0; color: #fffced; font-size: 14px; line-height: 1.4; }
.quick-guide-actions { display: flex; justify-content: flex-end; margin-top: 16px; }
.quick-guide-actions .primary { min-height: 44px; border-radius: 4px; background: #a34924; }
.quick-guide-actions .primary:hover { background: #873b1d; }
.quick-guide-details { padding-top: 12px; color: #324d40; font-size: 13px; }
.quick-guide-details summary { cursor: pointer; font-weight: 700; }
@media (max-width: 600px) {
  #modal.quick-guide-modal { padding: 12px; }
  #modal.quick-guide-modal > header { padding-bottom: 9px; margin-bottom: 9px; }
  .quick-guide-grid { gap: 8px; }
  .quick-guide-caption { padding-inline: 8px; padding-bottom: 8px; }
  .quick-guide-card h3 { font-size: 15px; }
  .quick-guide-icon { width: 20px; height: 20px; font-size: 14px; }
  .quick-guide-card p { font-size: 13px; }
  .quick-guide-actions { margin-top: 10px; }
}
@media (min-width: 640px) and (max-height: 480px) and (orientation: landscape) {
  #modal.quick-guide-modal { width: min(820px, 100%); padding: 12px; }
  #modal.quick-guide-modal > header { padding-bottom: 8px; margin-bottom: 8px; }
  .quick-guide-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
  .quick-guide-caption { padding-inline: 8px; padding-bottom: 8px; }
  .quick-guide-actions { margin-top: 10px; }
}