.mx{--ink:#242424;color:#f2f2f2;border-radius:8px;align-content:start;justify-items:center;gap:22px;min-height:min(1060px,150vh);padding:26px 16px 34px;display:grid;position:relative;overflow:clip}.mx [hidden]{display:none!important}.mx-sky{width:100%;height:100%;position:absolute;inset:0}.mx{background:#fff;color:#111!important}.mx-photos{pointer-events:none;background:radial-gradient(circle,#00000017 .8px,#0000 1.2px) 0 0/7px 7px;position:absolute;inset:0;overflow:hidden;-webkit-mask:radial-gradient(at 50% 40%,#000 30%,#00000059 85%);mask:radial-gradient(at 50% 40%,#000 30%,#00000059 85%)}.mx-photos .ph{aspect-ratio:3/4;width:min(25%,290px);rotate:var(--tilt);opacity:0;animation:40s linear infinite mx-panel;animation-delay:calc(var(--i) * 5s - 2s);background:#fff;border:2.5px solid #111;margin:0;padding:7px;position:absolute;top:6%;box-shadow:7px 7px 0 -1px #fff,7px 7px 0 1px #111,7px 7px 0 1px #111}.mx-photos .ph:after{content:"";z-index:-1;background:repeating-linear-gradient(135deg,#111 0 1px,#0000 1px 4px);position:absolute;inset:8px -8px -8px 8px}.mx-photos .ph.l{left:3%}.mx-photos .ph.r{top:14%;right:3%}.mx-photos .ph img{object-fit:cover;filter:grayscale()contrast(1.05)brightness(1.08);width:100%;height:100%;animation:20s ease-out infinite mx-kb;animation-delay:inherit;display:block}@keyframes mx-panel{0%{opacity:0;translate:0 10px}5%{opacity:.62;translate:0}25%{opacity:.62;translate:0}30%{opacity:0;translate:0 -6px}to{opacity:0}}@keyframes mx-kb{0%{scale:1}to{scale:1.08}}.mx-photos .ph{overflow:visible}.mx-photos .ph img{clip-path:inset(0)}@media (width<=640px){.mx-photos .ph{border-width:2px;width:34%;padding:4px;top:2%;box-shadow:4px 4px #111}.mx-photos .ph.r{top:4%}@keyframes mx-panel{0%{opacity:0}5%{opacity:.4}25%{opacity:.4}30%{opacity:0}to{opacity:0}}}@media (prefers-reduced-motion:reduce){.mx-photos .ph{opacity:.5;animation:none}.mx-photos .ph:nth-child(n+3){display:none}}.mx-gear{pointer-events:none;z-index:1;height:190px;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.mx-gear .ring{border-radius:50%;width:1800px;height:1800px;margin-left:-900px;animation:160s linear infinite mx-turn;position:absolute;top:70px;left:50%}.is-playing .mx-gear .ring{animation-duration:60s}.mx-gear .ring img{transform-origin:150px 900px;width:300px;rotate:var(--a);opacity:.85;margin-left:-150px;position:absolute;top:0;left:50%;translate:0 -64%}.mx-gear .teeth{background:repeating-conic-gradient(#000 0 .35deg, transparent .35deg 2deg);border-radius:50%;position:absolute;inset:0;-webkit-mask:radial-gradient(circle,#0000 896px,#000 897px 900px,#0000 901px);mask:radial-gradient(circle,#0000 896px,#000 897px 900px,#0000 901px)}.mx-gear .ring:before{content:"";border-radius:50%;position:absolute;inset:0;box-shadow:inset 0 0 0 1.5px #000}@keyframes mx-turn{to{rotate:360deg}}@media (width<=760px){.mx-gear{height:130px}.mx-gear .ring{width:1200px;height:1200px;margin-left:-600px;top:54px}.mx-gear .ring img{transform-origin:100px 600px;width:200px;margin-left:-100px}}.mx .px{color:#555!important}.mx-spine .px{color:#cfcfcf!important}.mx-skyname,.mx-hint{color:#555!important}.mx a{color:inherit}.mx-lcd,.mx-lcd *{color:#e6e6e6!important;text-shadow:0 0 5px #ffffff59!important}.mx-cover{background:radial-gradient(circle,#000 .7px,#0000 1px) 0 0/5px 5px,#fff!important}.mx-cover:before{background:repeating-linear-gradient(45deg,#000 0 1px,#fff 1px 3px)!important}.mx-spine{color:#fff!important;background:linear-gradient(#fff .6px,#0000 .6px) 0 0/6px 6px,linear-gradient(90deg,#fff .6px,#0000 .6px) 0 0/6px 6px,#000!important}.mx-side{background:repeating-linear-gradient(0deg,#0000 0 29px,#000 29px 29.6px) 0 46px/100% calc(100% - 46px) no-repeat,#fff!important}.mx-sB{background:repeating-linear-gradient(0deg,#0000 0 29px,#000 29px 29.6px) 0 46px/100% calc(100% - 46px) no-repeat,radial-gradient(circle,#000 .5px,#0000 .8px) 0 0/6px 6px,#fff!important}.mx-side h4 .mx-sb{color:#fff!important;background:#000!important}.mx-side h4{color:#000!important}.mx-jopen{color:#fff!important;background:#000!important}.mx-deck{background:repeating-linear-gradient(-45deg,#000 0 .6px,#fff .6px 3.5px)!important;border:1.5px solid #000!important;box-shadow:0 6px #000!important}.mx-key{color:#000!important;background:#fff!important;border:1.5px solid #000!important;box-shadow:0 4px #000!important}.mx-key.down,.mx-key[aria-pressed=true]{background:radial-gradient(circle,#000 .7px,#0000 1px) 0 0/4px 4px,#fff!important;box-shadow:0 1px #000!important}.mx-counter{background:#000!important}.mx-counter span{color:#000!important;background:#fff!important}.mx-lcd{background:#000!important;border:1.5px solid #000!important}.mx-ico span{background:#fffc;color:#111!important;text-shadow:none!important}.mx-tape,.mx-j{filter:drop-shadow(6px 6px #000)!important}.mx-j{transform-style:flat!important}.mx-jbtn{color:#111;font:13px var(--b-font);cursor:pointer;background:#fff;border:1.5px solid #111;border-radius:99px;margin:10px auto 0;padding:5px 16px;display:block}.mx-jbtn:active{background:#eee}.is-playing .mx-lcd,.is-playing .mx-lcd *{text-shadow:0 0 6px #ffbe6e73!important}.mx-side li.on a span:before{color:#111!important}.mx-warm{opacity:0;mix-blend-mode:screen;transition:opacity .6s}.is-playing .mx-warm{opacity:.16}.mx-led{background:#3a3a3a;border-radius:50%;width:9px;height:9px;box-shadow:inset 0 1px 2px #000}.is-playing .mx-led{background:#ffb24a;box-shadow:0 0 8px #ffb24a,0 0 2px #fff}.mx-sig{color:#111;width:110px;margin:4px 0 0;display:block}.mx-sig.sm{vertical-align:middle;color:#222;width:74px;margin:0;display:inline-block}.mx-skyline{z-index:1;color:#222;pointer-events:none;width:min(260px,40vw);display:none;position:absolute;bottom:34px;right:14px}.mx-skyname{z-index:2;pointer-events:none;background:#fff;margin:0;padding:0 6px;font-size:13px;position:absolute;bottom:6px;right:16px}.mx-hand{font-family:LXGW WenKai GB Screen,Kaiti SC,STKaiti,cursive}.mx-desk{z-index:5;gap:10px;margin:0;padding:0;list-style:none;display:grid;position:absolute;top:14px;left:14px}.mx-ico{cursor:default;-webkit-user-select:none;user-select:none;border:1px dotted #0000;outline:none;justify-items:center;gap:3px;width:70px;padding:4px 2px;display:grid}.mx-ico span{font:12px var(--b-font);color:#fff;text-shadow:1px 1px #000,0 0 4px #000;padding:0 3px}.mx-ico.sel svg{filter:brightness(.75)sepia()hue-rotate(280deg)saturate(3)}:is(.mx-ico.sel span,.mx-ico:focus-visible span){text-shadow:none;background:#5c5c5c}.mx-ico.sel{border-color:#fff9}.mx-wins{z-index:30;pointer-events:none;position:absolute;inset:0}.mx-win{pointer-events:auto;color:#1a1a1a;width:min(330px,100% - 16px);font:12px var(--b-font);background:#eee;border:2px solid #404040;border-color:#fff #404040 #404040 #fff;position:absolute;box-shadow:1px 1px #1a1a1a,6px 8px 18px #00000073}.mx-win.pop{animation:.22s ease-out mx-pop}@keyframes mx-pop{0%{opacity:0;transform:scale(.6)}}.mx-wbar{color:#fff;cursor:move;touch-action:none;-webkit-user-select:none;user-select:none;background:linear-gradient(90deg,#4f4f4f,#909090 60%,#c1c1c1);align-items:center;gap:3px;padding:3px 3px 3px 6px;display:flex}.mx-wbar b{white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:12px;overflow:hidden}.mx-wbtn{color:#1a1a1a;background:#eee;border:1.5px solid #404040;border-color:#fff #404040 #404040 #fff;place-items:center;width:18px;height:16px;padding:0;font:700 11px/1 system-ui,sans-serif;display:grid}button.mx-wbtn{cursor:pointer}.mx-wmenu{border-bottom:1px solid #c7c7c7;gap:12px;padding:2px 8px;font-size:11.5px;display:flex}.mx-wmenu span:first-letter{text-decoration:underline}.mx-wbody{background:#fff;border:2px solid #fff;border-color:#404040 #fff #fff #404040;max-height:240px;margin:4px;overflow:auto}.mx-wstatus{color:#404040;border:1px solid #fff;border-color:#404040 #fff #fff #404040;margin:0 4px 4px;padding:1px 6px;font-size:11px}.mx-files{border-collapse:collapse;width:100%;font-size:12px}.mx-files th{text-align:left;background:#eee;border:1px solid #707070;border-color:#fff #707070 #707070 #fff;padding:2px 6px;font-weight:400;position:sticky;top:0}.mx-files td{white-space:nowrap;padding:2px 6px}.mx-files td.px{color:#636363;font-size:9px}.mx-files a{color:#1a1a1a;text-decoration:none}.mx-files tr:hover td{background:#909090}.mx-files tr:hover a,.mx-files tr:hover td{color:#fff}.mx-icons{grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:8px;margin:0;padding:8px;list-style:none;display:grid}.mx-icons a{text-align:center;color:#1a1a1a;justify-items:center;gap:2px;font-size:11px;line-height:1.3;text-decoration:none;display:grid}.mx-icons a .mx-ic{font-size:24px;font-weight:400}.mx-icons a:hover{color:#5c5c5c}.mx-about{padding:8px 10px;font:13px/1.7 ui-monospace,Courier New,monospace}.mx-about p{margin:0 0 6px}.mx-about a{color:#5c5c5c}.mx-stage{z-index:2;justify-items:center;gap:12px;width:100%;padding-top:14px;display:grid;position:relative}.mx-float{perspective:1100px;width:min(460px,86vw);position:relative}.mx-tape{aspect-ratio:400/256;transform-style:preserve-3d;cursor:grab;touch-action:pan-y;filter:drop-shadow(0 18px 22px #00000073);outline:none;position:relative}.mx-tape:active{cursor:grabbing}.mx-face{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.mx-B{visibility:hidden;transform:rotateY(180deg)}.mx-tape.show-b .mx-B{visibility:visible}.mx-tape.show-b .mx-A{visibility:hidden}.mx-hub{transform-box:view-box}.mx-shadow{pointer-events:none;background:radial-gradient(circle,#000 .8px,#0000 1.1px) 0 0/4px 4px;border-radius:50%;height:22px;position:absolute;bottom:-46px;left:12%;right:12%;-webkit-mask:radial-gradient(closest-side,#000,#0000);mask:radial-gradient(closest-side,#000,#0000)}.mx-deck{background:linear-gradient(#ddd,#a9a9a9);border:1px solid #585858;border-radius:10px;align-items:center;gap:12px;margin-top:26px;padding:8px 10px;display:flex;box-shadow:inset 0 1px #fff,0 8px 16px #00000059}.mx-keys{gap:3px;display:flex}.mx-key{color:#2a2a2a;cursor:pointer;background:linear-gradient(#fcfcfc,#d9d9d9 70%,#bdbdbd);border:1px solid #484848;border-radius:3px 3px 6px 6px;width:44px;height:34px;font:700 12px system-ui,sans-serif;transition:transform 80ms,box-shadow 80ms;position:relative;box-shadow:0 4px #585858,0 5px 4px #0000004d}.mx-key:hover{color:#5c5c5c}.mx-key.down,.mx-key[aria-pressed=true]{transform:translateY(3px);box-shadow:0 1px #585858,0 1px 2px #0000004d}.mx-key[aria-pressed=true]{color:#909090;background:linear-gradient(#f2f2f2,#dcdcdc)}.mx-counter{background:#101010;border-radius:3px;gap:2px;padding:3px;display:flex;box-shadow:inset 0 2px 3px #000}.mx-counter span{color:#101010;background:linear-gradient(#f4f4f4 0 45%,#dadada 50%,#f4f4f4 55%);border-radius:2px;place-items:center;width:14px;height:22px;font:700 14px ui-monospace,Menlo,monospace;display:grid}.mx-lcd{color:#e0e0e0;text-shadow:0 0 6px #d3d3d399;white-space:nowrap;background:linear-gradient(#292929,#1a1a1a);border:2px solid #393939;border-radius:6px;width:min(420px,86vw);padding:6px 12px;font:13px ui-monospace,Menlo,Consolas,monospace;text-decoration:none;display:block;overflow:hidden;box-shadow:inset 0 2px 6px #0009}.mx-lcd-in{display:inline-block}.is-playing .mx-lcd.long .mx-lcd-in{padding-left:100%;animation:9s linear infinite mx-marq}@keyframes mx-marq{to{transform:translate(-100%)}}.mx-hint{color:#f3f3f3b3;margin:0;font-size:11.5px}.mx-jwrap{z-index:2;perspective:1400px;justify-items:center;width:100%;display:grid;position:relative}.mx-j{cursor:pointer;filter:drop-shadow(0 14px 18px #00000080);transform-style:preserve-3d;outline:none;align-items:stretch;display:flex}.mx-jp{box-sizing:border-box;height:300px;color:var(--ink);transform-origin:0;transition:transform .45s cubic-bezier(.4,1.3,.5,1),max-width .45s,padding .45s,opacity .3s;transition-delay:calc(var(--i) * .28s);background:#fcfcfc;flex:none;position:relative;overflow:hidden}.mx-j[aria-expanded=false] .mx-jp:not(.mx-cover){opacity:0;max-width:0;transition-delay:calc((4 - var(--i)) * .18s);padding-left:0;padding-right:0;transform:scaleX(.2)}.mx-jp+.mx-jp{box-shadow:inset 6px 0 6px -6px #2b2b2b59}.mx-cover{background:linear-gradient(#0000 0 60%,#f2f2f2 60%),repeating-linear-gradient(0deg,#0000 0 22px,#ebebeb 22px 23px),#fcfcfc;border-right:1px dashed #d5d5d5;flex-direction:column;width:250px;padding:16px 16px 14px;display:flex}.mx-cover:before{content:"";background:linear-gradient(#bebebe,#cdcdcd);width:8px;position:absolute;top:0;bottom:0;left:0}.mx-jk{color:#5c5c5c;letter-spacing:1px;margin:0;font-size:9px}.mx-cover h3{white-space:nowrap;letter-spacing:1px;margin:8px 0 2px;font-size:23px;font-weight:400;line-height:1.2}.mx-jsub{color:#696969;margin:0;font-size:12px}.mx-city{color:#242424;width:100%;margin-top:auto}.mx-cityname{color:#242424;margin:2px 0 0;font-size:14px}.mx-jopen{color:#fff;background:#909090;border-radius:99px;padding:2px 8px;font-size:11px;transition:opacity .3s;position:absolute;top:12px;right:12px}.mx-j[aria-expanded=true] .mx-jopen{opacity:0}.mx-spine{color:#fff;writing-mode:vertical-rl;background:linear-gradient(90deg,#909090,#bebebe);flex-direction:column;justify-content:space-between;align-items:center;width:44px;max-width:44px;padding:12px 0;display:flex}.mx-spine b{letter-spacing:3px;font-size:16px;font-weight:400}.mx-spine .px{letter-spacing:1px;font-size:8px}.mx-side{background:repeating-linear-gradient(0deg,#0000 0 29px,#e8e8e8 29px 30px) 0 46px/100% calc(100% - 46px) no-repeat,#fcfcfc;width:250px;max-width:250px;padding:14px 14px 10px}.mx-sB{background-color:#fbfbfb}.mx-side h4{font:bold 13px var(--b-font);color:#363636;letter-spacing:1px;align-items:center;gap:8px;margin:0 0 8px;display:flex}.mx-side h4 .mx-sb{color:#fff;background:#909090;border-radius:5px;place-items:center;width:22px;height:22px;font:700 15px Georgia,serif;display:grid}.mx-sB h4{color:#3a3a3a}.mx-sB h4 .mx-sb{background:#5d5d5d}.mx-side ol{margin:0;padding:0;list-style:none}.mx-side li{align-items:center;height:30px;display:flex}.mx-side li a{min-width:0;color:var(--ink);border-radius:4px;flex:1;grid-template-columns:24px 1fr auto;align-items:center;gap:4px;padding:0 4px;text-decoration:none;display:grid}.mx-side li a:hover,.mx-side li.on a{background:#9090901f}.mx-side li.on a span:before{content:"▶ ";color:#909090;font-size:10px}.mx-side li i{color:#5c5c5c;font-size:8px;font-style:normal}.mx-side li span{white-space:nowrap;text-overflow:ellipsis;font-size:15px;overflow:hidden}.mx-side li small{color:#8e8e8e;font-size:8px}.mx-blank i{width:24px}@media (width<=760px){.mx{min-height:0;padding:92px 10px 26px}.mx-desk{gap:2px;display:flex;top:6px;left:6px}.mx-ico{width:62px}.mx-key{width:36px;height:32px;font-size:11px}.mx-deck{flex-wrap:wrap;justify-content:center;gap:8px;padding:6px 8px}.mx-j{flex-direction:column}.mx-jp{transform-origin:top;height:auto;width:min(320px,90vw)!important;max-width:min(320px,90vw)!important}.mx-cover{border-bottom:1px dashed #d5d5d5;border-right:0;min-height:260px}.mx-spine{writing-mode:horizontal-tb;flex-direction:row;padding:8px 14px}.mx-j[aria-expanded=false] .mx-jp:not(.mx-cover){max-height:0;padding-top:0;padding-bottom:0;transform:rotateX(95deg);max-width:min(320px,90vw)!important}.mx-jp{max-height:400px;transition-property:transform,max-height,padding,opacity}}@media (prefers-reduced-motion:reduce){.mx *,.mx :before,.mx :after{transition-duration:10ms!important;transition-delay:0s!important;animation:none!important}}
