@charset "UTF-8";
:root{--ink:#172c29;--deep:#10231f;--cream:#eee8d9;--muted:#a8b2a4;--gold:#c2a977;--red:#a14735;--serif:"Noto Serif SC","Songti SC","STSong","SimSun",serif;--sans:"Microsoft YaHei","PingFang SC",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--cream);font-family:var(--sans);height:100svh;min-height:650px;display:flex;flex-direction:column;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}button:disabled{opacity:.3;cursor:default}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gold);outline-offset:5px}button:hover{color:#f4d397}a{color:inherit}.svg-defs{position:absolute;width:0;height:0;overflow:hidden}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.masthead{height:104px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 46px;border-bottom:1px solid #a7997029;position:relative}.brand{display:flex;align-items:center;gap:13px;text-decoration:none}.seal{background:var(--red);width:37px;height:47px;line-height:20px;display:grid;align-content:center;justify-content:center;font:18px/20px var(--serif);border:3px double #d5b494;color:#eee0c6;transform:rotate(-3deg)}.brand-type{font:18px var(--serif);letter-spacing:4px}.brand-type small{font:9px/2.5 var(--sans);display:block;letter-spacing:2px;color:var(--muted)}.work-title{position:absolute;left:50%;transform:translateX(-50%);text-align:center}.work-title h1{margin:0 0 9px;font:32px var(--serif);letter-spacing:9px;font-weight:500}.work-title>span{font:12px var(--sans);color:var(--muted);letter-spacing:3px}.work-title i,.gallery-topline i{display:inline-block;height:10px;width:1px;background:#9d98676b;margin:0 14px}.header-actions{display:flex;align-items:center;gap:25px}.text-button{font-size:13px;letter-spacing:2px;color:#c7cbbf}.icon-button{display:grid;place-items:center;width:38px;height:38px}.header-actions .icon-button{border-left:1px solid #ffffff18;padding-left:20px;width:47px}main{flex:1;min-height:0;display:flex;flex-direction:column}.gallery{flex:1;min-height:0;position:relative;background:#b5a37d;border-top:5px solid #756641;border-bottom:5px solid #756641;box-shadow:0 5px 25px #0003}.gallery-topline{height:46px;background:#e7decb;position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:0 45px;color:#6c6453;z-index:5;font:12px var(--sans);letter-spacing:2px;border-bottom:1px solid #746b4733}.gallery-topline b{font-family:var(--serif);font-size:16px;font-weight:400;color:#3a493d}.mode-control{display:flex;align-items:center;gap:21px;height:100%;letter-spacing:1px}.mode-control button{font-size:12px;height:100%;position:relative;color:#817561;padding:0 2px}.mode-control button.active{color:#30473d}.mode-control button.active:after{content:"";position:absolute;bottom:8px;left:15%;right:15%;height:1px;background:#75836a}.viewport{position:absolute;inset:46px 0 0;overflow:hidden;touch-action:none;cursor:grab;user-select:none;background:#b4a17b;outline-offset:-3px}.viewport.dragging{cursor:grabbing}.world{position:absolute;top:50%;left:0;transform-origin:0 0;will-change:transform;width:19634px;height:1000px}.tiles,.characters,.effects{position:absolute;inset:0}.tiles{display:flex}.painting-tile{height:1000px;flex:none;pointer-events:none;user-select:none}.edge-shade{position:absolute;top:0;bottom:0;width:45px;pointer-events:none;z-index:2}.edge-shade.left{left:0;background:linear-gradient(90deg,#34342138,transparent)}.edge-shade.right{right:0;background:linear-gradient(-90deg,#34342138,transparent)}.scene-caption{position:absolute;left:44px;bottom:36px;display:flex;gap:16px;align-items:center;color:#303d31;z-index:3;pointer-events:none;padding:13px 25px 13px 0;text-shadow:0 1px #f3e8c3;background:linear-gradient(90deg,#e8dbbada,#e8dbbaa3 70%,transparent)}.caption-line{height:45px;background:#66714f;width:2px}.scene-caption>span:nth-child(2){font:15px var(--serif);writing-mode:vertical-rl;letter-spacing:2px}.scene-caption h2{font:26px var(--serif);letter-spacing:5px;margin:0 0 6px}.scene-caption p{font:12px var(--sans);margin:0;letter-spacing:2px;color:#645f49}.canvas-tools{position:absolute;right:30px;bottom:31px;display:flex;align-items:center;z-index:5;background:#eee7d8e8;border:1px solid #74694444;box-shadow:0 4px 18px #42392216;color:#384b40;height:41px;border-radius:3px}.canvas-tools button{width:39px;height:39px;font-size:22px;display:grid;place-items:center}.canvas-tools button:hover{color:#a14735}.canvas-tools span{font-size:11px;min-width:41px;text-align:center}.canvas-tools .tool-divider{min-width:1px;height:15px;background:#77714c44;margin:0 3px}.canvas-tools svg{width:15px;height:15px}.edge-button{position:absolute;top:53%;z-index:3;width:35px;height:66px;display:grid;place-items:center;background:#e7decb99;color:#3f4b3a;border:1px solid #74694433;transition:background .2s}.edge-button:hover{background:#eee4ce;color:#304135}.edge-button.prev{left:0;border-radius:0 3px 3px 0}.edge-button.next{right:0;border-radius:3px 0 0 3px}.drag-hint{position:absolute;left:50%;bottom:36px;transform:translateX(-50%);z-index:3;font-size:12px;letter-spacing:2px;background:#243b30ca;color:#e9dfc3;padding:10px 18px;border:1px solid #d4c99f61;border-radius:30px;pointer-events:none;white-space:nowrap;transition:opacity .7s}.drag-hint span{margin:0 9px;color:#d6bd80}.drag-hint.dismissed{opacity:0}.loading{position:absolute;inset:0;background:#dfd3b4;z-index:10;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#4e573f;transition:opacity .7s}.loading.hidden{opacity:0;pointer-events:none}.loading-seal{font:44px var(--serif);border:1px solid #8e6b4c;padding:18px;animation:breathe 2s infinite}.loading p{font:14px var(--serif);letter-spacing:4px;margin:20px}.navigation{flex:none;padding:20px 46px 0;background:radial-gradient(ellipse at 50% 0,#24423766,transparent 80%);height:172px}.navigation-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.navigation-label{font:14px var(--serif);letter-spacing:3px}.navigation-label small{font:9px var(--sans);letter-spacing:2px;margin-left:17px;color:#99a89a}.tour-button{display:flex;align-items:center;gap:8px;font-size:12px;letter-spacing:1px;color:#c7cbbf}.tour-button svg{width:14px;height:14px}.tour-button.active{color:#e2c286}.minimap-row{display:flex;align-items:center;gap:14px}.scroll-end{font:12px var(--serif);writing-mode:vertical-rl;letter-spacing:4px;color:#99a490}.minimap{position:relative;height:51px;flex:1;background:#b6a67e;cursor:pointer;touch-action:none;border:1px solid #b29c7055;overflow:hidden}.minimap img{width:100%;height:100%;object-fit:fill;pointer-events:none;opacity:.64;filter:saturate(.65)}.map-window{position:absolute;top:-1px;height:calc(100% + 2px);border:2px solid #dac58d;box-shadow:0 0 0 3000px #0a1d1754;background:#f0d7970c;pointer-events:none;min-width:12px}.map-window span{position:absolute;top:50%;width:3px;height:12px;background:#dac58d;transform:translateY(-50%)}.map-window span:first-child{left:1px}.map-window span:last-child{right:1px}.map-markers{position:absolute;inset:0;pointer-events:none}.map-marker{position:absolute;bottom:3px;width:4px;height:4px;background:#f4e5b4;transform:rotate(45deg);box-shadow:0 0 3px #000}.map-marker.discovered{background:#b4432d}.chapters{display:flex;justify-content:space-between;flex-direction:row-reverse;padding:10px 30px 0;gap:8px}.chapter{position:relative;color:#92a294;font:13px var(--serif);letter-spacing:2px;padding:0 8px 8px;white-space:nowrap}.chapter:before{content:"";position:absolute;width:3px;height:3px;border-radius:50%;background:currentColor;left:50%;top:-15px;opacity:0}.chapter.active{color:#e8d4a5}.chapter.active:before{opacity:1}.chapter small{font:10px var(--sans);margin-right:9px;color:#bdac80}footer{height:40px;flex:none;padding:0 46px 8px;display:flex;justify-content:space-between;align-items:center;color:#96a596;font-size:11px;letter-spacing:1px}.footer-tip{display:flex;align-items:center;gap:9px}.small-star{font-size:18px;color:#d2b678}#discovery-count b{font-weight:400;color:#d9c596;font-size:14px}footer button{font-size:11px;color:#96a596}footer button span{margin-left:8px}.character{position:absolute;border:0;padding:0;background:none;overflow:visible;cursor:pointer;transform-origin:50% 93%;z-index:2}.character-sprite{position:absolute;width:100%;height:100%;inset:0;object-fit:contain;transform-origin:50% 94%;animation:figure-idle 5s ease-in-out infinite;pointer-events:none;will-change:transform}.character:hover .character-sprite,.character.selected .character-sprite{filter:drop-shadow(0 0 4px #f9e6ae)}.character-hit{position:absolute;inset:0;min-width:44px;min-height:44px;left:50%;top:50%;transform:translate(-50%,-50%)}.character-marker{position:absolute;left:50%;top:105%;transform:translateX(-50%);width:32px;height:32px;border:1px solid #f3e1ae;border-radius:50%;background:#2c4937b3;color:#faecc9;box-shadow:0 1px 5px #44372044;display:grid;place-items:center;transition:background .3s}.character-marker:before{content:"";width:6px;height:6px;background:#f1db9b;transform:rotate(45deg)}.character-marker:after{content:"";position:absolute;inset:-8px;border:1px solid #f3dfaa99;border-radius:50%;animation:beacon 3s ease-out infinite}.character-label{position:absolute;top:calc(105% + 37px);left:50%;transform:translateX(-50%);white-space:nowrap;background:#253b2bde;padding:6px 12px;color:#f1e0b7;font:21px var(--serif);letter-spacing:3px;border-radius:3px;opacity:0;transition:opacity .2s}.character:hover .character-label,.character:focus-visible .character-label,.character.selected .character-label{opacity:1}.character.discovered .character-marker{background:#944330c9}.original .character{visibility:hidden}.motion-paused .character-sprite,.motion-paused .character-marker:after,.motion-paused .particle{animation-play-state:paused}.character.reacting .character-sprite{animation:figure-greet 1.6s ease-in-out both}.particle{position:absolute;pointer-events:none;color:#f9e5aa;font:25px var(--serif);animation:particle-rise 2s ease-out forwards}.character-panel{position:absolute;top:62px;right:18px;bottom:17px;width:290px;z-index:8;overflow:auto;background:#eee6d5f5;color:#334637;border:1px solid #a18e6759;box-shadow:0 12px 45px #25312542;animation:panel-enter .35s ease-out;overscroll-behavior:contain;scrollbar-width:thin}.character-panel[hidden]{display:none}.panel-close{position:absolute;right:8px;top:6px;z-index:2;color:#6e745e}.panel-heading{display:flex;justify-content:space-between;margin:22px 47px 0 25px;font-size:10px;letter-spacing:2px;color:#8a8064}.portrait-wrap{height:150px;position:relative;margin:5px 25px 0;display:flex;justify-content:center;background:radial-gradient(ellipse,#cabd952b,transparent 70%);border-bottom:1px solid #7a76532b}.portrait-wrap img{height:148px;max-width:170px;object-fit:contain;animation:portrait-idle 5s ease-in-out infinite;filter:drop-shadow(3px 4px 3px #6c60352b)}.portrait-seal{position:absolute;right:6px;bottom:22px;font:11px/1.4 var(--serif);letter-spacing:2px;color:#a35b41;border:1px solid #ad735c;padding:4px;transform:rotate(4deg)}.character-copy{padding:16px 25px 20px}.eyebrow{font-size:10px;letter-spacing:3px;color:#897f5f}.character-copy h2{font:25px var(--serif);letter-spacing:5px;margin:8px 0 11px}.character-copy p{font-size:13px;line-height:1.9;color:#72715b;margin:0}.character-copy blockquote{font:16px/1.8 var(--serif);margin:14px 0;color:#6e674d;letter-spacing:1px;padding-left:11px;border-left:2px solid #bc9d6b}.interact-button{width:100%;display:flex;justify-content:space-between;align-items:center;padding:11px 16px;background:#35523f;color:#f3e5bd;font:13px var(--serif);letter-spacing:2px}.interact-button:hover{background:#43614b}.character-copy .interpretation{font-size:10px;text-align:center;margin-top:8px;color:#9a9077}.toast{position:fixed;left:50%;bottom:210px;transform:translate(-50%,12px);background:#223d30ef;border:1px solid #b19c6b66;color:#f2e4c1;padding:13px 22px;font:15px/1.7 var(--serif);letter-spacing:1px;z-index:30;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;max-width:min(85vw,500px);text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}dialog{border:1px solid #ac9568;padding:42px;max-width:550px;width:calc(100% - 36px);background:#eee6d5;color:#384636;box-shadow:0 20px 80px #0005}dialog::backdrop{background:#0d231ccb;backdrop-filter:blur(4px)}dialog>.icon-button{position:absolute;right:10px;top:10px}dialog h2{font:29px var(--serif);letter-spacing:4px;margin:15px 0 22px}dialog p{font-size:14px;line-height:2;color:#636a54}.about-controls{display:grid;grid-template-columns:36px 1fr;gap:7px 16px;border-block:1px solid #8c825736;padding:13px 0;margin:18px 0;align-items:baseline}.about-controls>span{font:14px var(--serif)}.about-controls p{margin:0;font-size:12px}.source-note{font-size:12px!important}.source-links{display:flex;gap:25px}.source-links a{font-size:12px;text-underline-offset:5px}
.repairs{position:absolute;inset:0;pointer-events:none}.effects{pointer-events:none}.original .repairs{visibility:hidden}.character-sprite{animation-duration:var(--idle-duration,5s)}.character[data-id="dance"] .character-sprite{animation-name:dance-idle;transform-origin:45% 81%}.character[data-id="flowers"] .character-sprite{animation-name:tend-idle;transform-origin:63% 86%}.character[data-id="butterfly"] .character-sprite{animation-name:dance-idle;transform-origin:49% 82%}.character.reacting .character-sprite{animation-name:figure-greet;animation-duration:1.6s;animation-delay:0s}
@keyframes figure-idle{0%,100%{transform:scale(1.008,1.003) rotate(-.18deg)}50%{transform:scale(1.013,1.012) rotate(.22deg)}}@keyframes dance-idle{0%,100%{transform:rotate(-.65deg) scale(1.005)}50%{transform:rotate(.65deg) scale(1.009)}}@keyframes tend-idle{0%,100%{transform:rotate(-.35deg) scale(1.003)}50%{transform:rotate(.5deg) scale(1.01)}}@keyframes figure-greet{0%,100%{transform:scale(1.005)}35%{transform:rotate(-2deg) scale(1.025)}70%{transform:rotate(1.2deg) scale(1.015)}}@keyframes portrait-idle{0%,100%{transform:translateY(0) rotate(-.4deg)}50%{transform:translateY(-3px) rotate(.4deg)}}@keyframes beacon{0%{transform:scale(.8);opacity:.8}90%,100%{transform:scale(1.45);opacity:0}}@keyframes breathe{50%{opacity:.5}}@keyframes panel-enter{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:translateX(0)}}@keyframes particle-rise{to{transform:translate(var(--dx),-120px) rotate(30deg);opacity:0}}
@media(min-width:1700px){.masthead{height:120px}.navigation{height:192px;padding-top:24px}.minimap{height:64px}.chapters{padding-top:15px}.character-panel{width:330px}.portrait-wrap{height:200px}.portrait-wrap img{height:190px}.character-copy p{font-size:14px}}
@media(max-width:800px){body{min-height:520px}.masthead{height:85px;padding:0 20px}.brand-type{display:none}.seal{width:31px;height:39px;font-size:15px;line-height:16px}.work-title h1{font-size:25px;letter-spacing:6px;margin-bottom:6px}.work-title>span{font-size:10px;letter-spacing:2px}.header-actions{gap:8px}.header-actions .icon-button{width:30px;padding:0;border:0}.text-button{font-size:11px;letter-spacing:0}.gallery-topline{padding:0 18px;height:39px;font-size:10px;letter-spacing:0}.gallery-topline b{font-size:13px}.gallery-topline i{margin:0 9px}.mode-control{gap:13px}.mode-control button{font-size:11px}.viewport{top:39px}.navigation{height:151px;padding:16px 18px 0}.navigation-heading{margin-bottom:11px}.navigation-label{font-size:13px}.navigation-label small{font-size:8px;margin-left:10px;letter-spacing:1px}.minimap{height:44px}.minimap-row{gap:8px}.chapters{padding:10px 8px 0;gap:0}.chapter{padding:0 4px 8px;font-size:11px;letter-spacing:1px}.chapter small{display:none}footer{padding:0 20px 8px;height:35px;font-size:10px}footer button{font-size:10px}.scene-caption{left:20px;bottom:22px;gap:11px;padding:9px 16px 9px 0}.scene-caption h2{font-size:22px}.scene-caption p{font-size:10px;letter-spacing:1px}.canvas-tools{right:15px;bottom:21px;height:35px}.canvas-tools button{width:30px;height:33px}.canvas-tools span{min-width:35px}.canvas-tools .tool-divider{margin:0}.drag-hint{bottom:98px;padding:8px 11px;font-size:11px}.drag-hint span{margin:0 5px}.edge-button{width:27px;height:49px}.character-panel{width:265px;top:51px;right:12px;bottom:12px}.portrait-wrap{height:112px}.portrait-wrap img{height:108px}.character-copy{padding:13px 22px 18px}.character-copy h2{font-size:23px}.character-copy p{font-size:12px}.character-copy blockquote{margin:10px 0;font-size:14px}.toast{bottom:187px}}
@media(max-width:520px){.header-actions .text-button{display:none}.masthead{height:78px}.gallery-topline>span:first-child{font-size:0}.gallery-topline b{font-size:13px;letter-spacing:2px}.gallery-topline i{display:none}.gallery{border-width:3px}.navigation{height:145px;padding:14px 12px 0}.navigation-label small{display:none}.navigation-heading{padding:0 10px}.tour-button{font-size:11px}.minimap-row{gap:5px}.scroll-end{font-size:10px;letter-spacing:2px}.minimap{height:45px}.chapters{padding:12px 0 0}.chapter{font-size:11px;letter-spacing:0;padding:0 3px 8px}.scene-caption{left:17px;bottom:19px}.scene-caption h2{font-size:20px;letter-spacing:3px}.scene-caption p{max-width:160px}.scene-caption>span:nth-child(2){display:none}.canvas-tools{right:12px;bottom:19px}.canvas-tools button{width:28px}.canvas-tools span{min-width:31px}.footer-tip span:last-child{font-size:10px}.footer-tip{gap:4px}footer{padding:0 15px 6px;font-size:10px}footer button{font-size:0}footer button span{font-size:14px}.character-panel{top:48px;width:245px;max-height:calc(100% - 61px)}.character-copy p{line-height:1.8}.panel-heading{margin-top:18px}.portrait-wrap{height:110px}.character-copy{padding-top:10px}.portrait-wrap img{height:108px}dialog{padding:30px 25px}dialog h2{font-size:24px}.source-links{gap:16px}.toast{font-size:13px;width:max-content}}
@media(max-height:680px) and (min-width:801px){body{min-height:480px}.masthead{height:77px}.navigation{height:139px;padding-top:12px}.minimap{height:39px}.gallery-topline{height:35px}.viewport{top:35px}.character-panel{top:45px}.portrait-wrap{height:90px}.portrait-wrap img{height:90px}.character-copy{padding-top:8px}.character-copy h2{font-size:22px;margin:5px 0}.character-copy blockquote{margin:8px 0}.character-copy p{font-size:12px}.panel-heading{margin-top:15px}}
@media(orientation:landscape) and (max-height:500px){body{min-height:360px}.masthead{height:56px}.work-title h1{font-size:21px;margin:0}.work-title>span{display:none}.gallery-topline{height:30px}.viewport{top:30px}.navigation{height:100px;padding-top:7px}.navigation-heading{margin-bottom:5px}.minimap{height:29px}.chapters{padding-top:5px}.chapter{font-size:10px}footer{height:22px}.scene-caption{bottom:10px}.scene-caption h2{font-size:19px}.scene-caption p{display:none}.canvas-tools{bottom:12px}.drag-hint{bottom:20px}.character-panel{top:38px;width:310px}.portrait-wrap{float:left;width:85px;height:140px;margin:25px 6px 0 10px;border:0}.portrait-wrap img{width:85px;height:135px}.portrait-seal{display:none}.character-copy{padding:10px 15px}.character-copy p{font-size:11px}.character-copy h2{font-size:21px}.character-copy blockquote{font-size:12px}.panel-heading{margin-top:12px}.interpretation{display:none}.toast{bottom:125px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}}
.character-skeleton{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;display:none}.rig-ready .character-skeleton{display:block}.rig-ready .character-sprite{visibility:hidden}.character-marker{top:91%}.character-label{top:calc(91% + 37px)}.walk-button{display:flex;width:100%;justify-content:space-between;align-items:center;border:1px solid #8b8c6e66;margin-top:8px;padding:10px 15px;font:13px var(--serif);letter-spacing:2px;color:#466044}.walk-button:hover{background:#d4ccb744;color:#35523f}.walk-button[hidden]{display:none}.rig-options{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#8b856b;margin-top:12px}.rig-options button{font-size:10px;text-decoration:underline;text-underline-offset:3px;color:#596b4d}.rig-options button[aria-pressed=true]{color:#a34835}.navigation{height:208px}.character-jumps{display:flex;justify-content:space-between;gap:5px;border-top:1px solid #e2d3a512;margin:1px 30px 0;padding-top:6px}.character-jumps button{display:flex;gap:7px;align-items:center;justify-content:center;min-height:30px;color:#9fab98;font:11px var(--serif);letter-spacing:1px}.character-jumps b{font:10px var(--sans);display:grid;place-items:center;background:#ab5035;color:#fff1d1;width:18px;height:18px;border:1px solid #e0b77b;border-radius:50%;flex:none}.character-jumps button.selected{color:#f4dca7}.character-jumps button.selected b{background:#e4ca83;color:#293d2d}.character-jumps button.discovered b{box-shadow:0 0 0 2px #b8a77d33}.map-markers{z-index:3}.map-marker{pointer-events:auto;bottom:auto;top:3px;transform:translateX(-50%);width:22px;height:22px;padding:0;border:1.5px solid #f6dfb3;border-radius:50%;background:#a84530;color:#fff7dc;font:bold 11px var(--sans);box-shadow:0 1px 5px #172318c9}.map-marker:nth-child(even){top:auto;bottom:3px}.map-marker:after{content:"";position:absolute;left:50%;top:100%;width:1px;height:8px;background:#f6dfb3;pointer-events:none}.map-marker:nth-child(even):after{top:auto;bottom:100%}.map-marker:hover,.map-marker.selected{background:#ead19b;color:#263e2e;z-index:4;box-shadow:0 0 0 3px #f4d49766}.map-marker.discovered{background:#596d46}.map-marker.selected{background:#ead19b}.map-window{border-color:#fff0c2;box-shadow:0 0 0 3000px #0a1d1738}.minimap img{opacity:.85;filter:saturate(.8)}
@media(max-width:800px){.navigation{height:190px}.character-jumps{margin:0 6px;padding-top:3px;gap:1px}.character-jumps button{font-size:10px;min-height:35px;gap:4px}.character-jumps b{width:16px;height:16px;font-size:9px}.character-jumps span{letter-spacing:0}.map-marker{width:20px;height:20px;font-size:10px}.toast{bottom:228px}}
@media(max-width:520px){.navigation{height:192px}.character-jumps{margin:0;gap:0}.character-jumps button{flex:1;min-width:0;min-height:44px;flex-direction:column;gap:3px;font-size:9px}.character-jumps span{font-size:8px;white-space:nowrap}.character-jumps b{width:18px;height:18px;font-size:10px}.character-panel{width:255px}.portrait-wrap{height:92px}.portrait-wrap img{height:90px}.walk-button{padding:8px 13px}.rig-options{margin-top:9px}.character-copy .interpretation{margin-top:5px}.toast{bottom:232px}}
@media(orientation:landscape) and (max-height:500px){.navigation{height:129px}.character-jumps{padding-top:0}.character-jumps button{min-height:27px}.character-jumps b{width:15px;height:15px}.character-jumps span{font-size:10px}.walk-button{padding:6px 10px}.rig-options{margin-top:5px}.toast{bottom:157px}.map-marker{height:17px;width:17px;font-size:9px}.map-marker:after{height:3px}}
.character-copy .motion-state{text-align:center;color:#7c8569;font:11px var(--serif);margin:10px 0 0;letter-spacing:1px}.portrait-wrap img{max-width:190px}.character-panel{background:#eee6d5fa}
.character-jumps .short-name{display:none}@media(max-width:520px){.character-jumps .full-name{display:none}.character-jumps .short-name{display:inline;font-size:12px;letter-spacing:1px}}
.characters{isolation:isolate}.character-jumps{position:relative;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#bba17066 transparent;gap:16px;padding-bottom:3px}.character-jumps button{flex:0 0 auto;min-width:99px;white-space:nowrap}.map-marker[hidden]{display:none}.map-marker.cluster{width:31px;border-radius:12px;font-size:10px}.map-marker.lower-row:after{top:auto;bottom:100%}.map-marker:not(.lower-row):after{top:100%;bottom:auto}.navigation-label small{letter-spacing:1px}.loading.hidden{visibility:hidden}
@media(max-width:800px){.character-jumps{gap:10px}.character-jumps button{min-width:82px}}
@media(max-width:520px){.character-jumps{gap:4px;scrollbar-width:none}.character-jumps button{min-width:42px;flex:0 0 42px}.navigation-label small{display:inline;font-size:10px;margin-left:10px;letter-spacing:0}.map-marker.cluster{width:29px}.character-jumps:focus-within{scrollbar-width:thin}}

/* Details size to their content and may extend across the scroll explorer. */
.navigation,.navigation *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.navigation img{-webkit-user-drag:none}
main{position:relative}
.character-panel{--panel-top:64px;top:var(--panel-top);right:18px;bottom:auto;width:360px;height:auto;max-height:calc(100% - var(--panel-top) - 12px);padding:19px 24px 18px;z-index:20;overflow-x:hidden;overflow-y:auto}
.character-panel .panel-heading{margin:0 28px 10px 0;min-height:18px;align-items:center;line-height:1.6}
.character-hero{display:flex;align-items:center;gap:18px;border-bottom:1px solid #7a76532b;margin-bottom:14px;padding-bottom:12px}
.character-panel .portrait-wrap{float:none;flex:0 0 100px;width:100px;height:128px;margin:0;border:0}
.character-panel .portrait-wrap img{width:100%;height:100%;max-width:100%;object-fit:contain}
.character-panel .portrait-seal{display:block;right:-4px;bottom:4px;font-size:9px;padding:3px}
.character-intro{min-width:0;flex:1}
.character-intro .eyebrow{font-size:10px;letter-spacing:2px}
.character-intro h2{font:25px/1.5 var(--serif);letter-spacing:3px;margin:9px 0 0;color:#334637;overflow-wrap:anywhere}
.character-panel .character-copy{padding:0}
.character-panel .character-copy p{font-size:13px;line-height:1.85}
.character-panel .character-copy blockquote{font-size:15px;line-height:1.75;margin:13px 0}
.character-panel .interact-button{min-height:42px;padding:10px 14px}
.character-panel .character-copy .motion-state{font-size:11px;margin:10px 0 0;line-height:1.5}
.character-panel .character-copy .interpretation{display:block;font-size:10px;line-height:1.5;margin-top:5px}
.header-actions #sound-button{border:0;padding:0;width:34px}
#sound-button[aria-pressed=true]{color:#82978a}
@media(max-width:800px){
  .character-panel{--panel-top:53px;right:12px;width:330px;padding:16px 20px}
  .character-panel .portrait-wrap{flex-basis:86px;width:86px;height:106px}
  .character-intro h2{font-size:23px;letter-spacing:2px}
}
@media(max-width:520px){
  .character-panel{--panel-top:49px;right:12px;width:calc(100% - 24px);max-width:360px;padding:15px 19px 14px}
  .character-panel .panel-heading{font-size:10px;letter-spacing:1px;margin-bottom:7px}
  .character-hero{gap:17px;padding-bottom:10px;margin-bottom:12px}
  .character-panel .portrait-wrap{flex-basis:82px;width:82px;height:98px}
  .character-intro h2{font-size:24px;margin-top:7px}
  .character-panel .character-copy blockquote{font-size:15px;margin:11px 0}
  .character-panel .panel-close{top:5px;right:5px}
  .header-actions{gap:3px}.header-actions #sound-button{width:28px}
  .work-title h1{font-size:clamp(20px,5.8vw,25px);letter-spacing:4px}
  footer #source-button{font-size:10px;letter-spacing:0;white-space:nowrap}footer #source-button span{font-size:11px;margin-left:3px}
}
@media(max-height:700px){
  .character-panel{padding-top:12px;padding-bottom:12px}
  .character-panel .portrait-wrap{height:84px}
  .character-hero{margin-bottom:10px;padding-bottom:9px}
  .character-panel .character-copy blockquote{margin:10px 0}
}
@media(max-width:520px){footer{gap:8px;letter-spacing:0}#discovery-count{white-space:nowrap}.footer-tip{min-width:0}.footer-tip span:last-child{white-space:nowrap}}
@media(max-width:380px){.footer-tip span:last-child{display:none}}
@media(max-height:680px) and (min-width:801px){.character-panel{--panel-top:46px}}
@media(orientation:landscape) and (max-height:500px){
  .character-panel{--panel-top:39px;width:min(580px,calc(100% - 24px));display:grid;grid-template-columns:118px minmax(0,1fr);gap:6px 20px;padding:12px 20px}
  .character-panel .panel-heading{grid-column:1/-1;margin-bottom:1px}
  .character-hero{grid-column:1;flex-direction:column;gap:4px;align-self:center;margin:0;padding:0;border:0;text-align:center}
  .character-panel .portrait-wrap{flex-basis:auto;width:82px;height:102px}
  .character-panel .portrait-seal{display:none}
  .character-intro .eyebrow{display:none}
  .character-intro h2{font-size:19px;line-height:1.35;margin:0;letter-spacing:1px}
  .character-panel .character-copy{grid-column:2;grid-row:2}
  .character-panel .character-copy p{font-size:12px;line-height:1.65}
  .character-panel .character-copy blockquote{font-size:13px;line-height:1.6;margin:7px 0}
  .character-panel .interact-button{min-height:34px;padding:8px 12px;font-size:12px}
  .character-panel .character-copy .motion-state{margin-top:6px}
  .character-panel .character-copy .interpretation{margin-top:2px;font-size:9px}
}