.masterpiece-dialog{position:fixed;inset:0;width:100vw;height:100svh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;overflow:hidden;color:#101540;outline:none}
.masterpiece-dialog::backdrop{background:rgb(255 237 196 / 32%)}
.masterpiece-dialog[open]{display:grid;place-items:center}
.masterpiece-window{position:relative;display:flex;flex-direction:column;width:min(860px,calc(100vw - 36px),calc(100svh - 78px));border:3px solid #101540;border-radius:9px;background:#090521;box-shadow:0 0 0 2px #fff7dc,4px 7px 0 #ff20b7,4px 7px 0 2px #101540;isolation:isolate;container-type:inline-size;transform-origin:center}
.masterpiece-titlebar{position:relative;z-index:5;flex:0 0 auto;display:grid;grid-template-columns:24px minmax(0,1fr) 24px;align-items:center;gap:12px;padding:5px 7px;border-bottom:3px solid #101540;border-radius:5px 5px 0 0;background:repeating-linear-gradient(0deg,#ff57c7 0 2px,#a61588 2px 3px,#ff98df 3px 5px)}
.masterpiece-window-label{justify-self:center;max-width:100%;box-sizing:border-box;padding:2px 12px 3px;border:2px solid #101540;border-radius:5px;background:#fff8dc;font:700 clamp(7px,2.05cqw,16px)/1.1 System,'Courier New',monospace;white-space:nowrap;text-align:center}
.masterpiece-close,.masterpiece-minimize{display:grid;place-items:center;width:24px;height:24px;padding:0;border:2px solid #101540;border-radius:2px;color:#101540;background:#fff8dc;font:400 28px/17px Arial,sans-serif;cursor:pointer}
.masterpiece-close span{position:relative;top:-1px}
.masterpiece-minimize{background:#14eaff;font-size:27px}
.masterpiece-close:hover,.masterpiece-minimize:hover{background:#fff500}
.masterpiece-close:focus-visible,.masterpiece-minimize:focus-visible{outline:2px solid white;outline-offset:2px}
.masterpiece-body{position:relative;aspect-ratio:1;width:100%;border-radius:0 0 5px 5px;overflow:hidden;background:#090521}
.masterpiece-body>img{position:absolute;display:block;height:auto;pointer-events:none;user-select:none}
.masterpiece-background{position:absolute;inset:0;z-index:0;background:radial-gradient(ellipse at 50% 28%,#6012ac 0,transparent 48%),linear-gradient(#090521,#080522 55%,#24083f)}
.masterpiece-graphics{position:absolute;inset:0;width:100%;height:100%}
.masterpiece-rays{position:absolute;inset:0;background:repeating-conic-gradient(from 3deg at 50% 27%,transparent 0deg 12deg,#8e38f52b 12deg 13deg,transparent 13deg 24deg);mask-image:linear-gradient(black,transparent 75%)}
.masterpiece-horizon{position:absolute;inset:58% 0 auto;height:1px;background:#ff26d4;box-shadow:0 0 2cqw .5cqw #ff26d4}
.comic-graphics,.futurist-graphics{display:none}
.arcade-sparks{animation:masterpiece-spark 1.8s steps(1) infinite}
.masterpiece-portrait{position:absolute;top:1%;left:35%;width:30%;height:auto;z-index:1;filter:drop-shadow(0 0 .6cqw #fffbdc55);pointer-events:none}
.masterpiece-figure{top:-3%;width:54%;z-index:2}
.masterpiece-figure-left{left:-6%}
.masterpiece-figure-right{right:-6%}
.masterpiece-logo{left:9%;top:31%;width:82%;z-index:3}
.masterpiece-tagline{position:absolute;top:67.5%;left:2%;width:96%;display:flex;flex-direction:column;align-items:center;z-index:4;pointer-events:none;animation:masterpiece-shout .55s steps(1) infinite;filter:drop-shadow(.22cqw 0 0 #000) drop-shadow(-.22cqw 0 0 #000) drop-shadow(0 .22cqw 0 #000) drop-shadow(0 -.22cqw 0 #000)}
.masterpiece-shout-first{display:block;width:47.4%;height:auto}
.masterpiece-shout-second{display:flex;width:100%;align-items:center}
.masterpiece-shout-words{display:block;width:93.2%;height:auto}
.masterpiece-exclamation{display:block;width:6.8%;height:auto;overflow:visible}
.masterpiece-start{position:absolute;left:27.5%;top:87.5%;width:45%;height:11.25%;z-index:4;margin:0;padding:0;border:0;border-radius:999px;background:transparent;opacity:1;appearance:none;cursor:pointer}
.masterpiece-button-art{position:absolute;inset:0;display:block;width:100%;height:100%}
.masterpiece-button-glow{position:absolute;inset:4% 1% 10%;border-radius:999px;box-shadow:0 0 1.3cqw .25cqw #00eaff,0 0 2.7cqw .5cqw #ff29bd;animation:masterpiece-button-glow 2.8s ease-in-out infinite;pointer-events:none}
.masterpiece-button-shine{position:absolute;inset:12% 4% 23%;overflow:hidden;border-radius:999px;pointer-events:none}
.masterpiece-button-shine::after{content:"";position:absolute;inset:-50% auto -50% -70%;width:42%;background:linear-gradient(105deg,transparent 0%,rgb(255 255 255 / 12%) 20%,rgb(255 255 255 / 78%) 52%,rgb(255 255 255 / 15%) 78%,transparent 100%);transform:translateX(0) skewX(-15deg);animation:masterpiece-button-sweep 2.8s ease-in-out infinite}
.masterpiece-dialog[data-transition] .masterpiece-window{will-change:transform,opacity}
body.masterpiece-window-open .room .glow-image{display:none}
body.masterpiece-window-open .room .creature{animation:none}
body.masterpiece-window-open .room .base-image{filter:none}
@keyframes masterpiece-button-glow{0%,100%{opacity:.2}50%{opacity:.7}}
@keyframes masterpiece-button-sweep{0%,12%{transform:translateX(0) skewX(-15deg)}75%,100%{transform:translateX(480%) skewX(-15deg)}}
@keyframes masterpiece-shout{0%,100%{opacity:1}65%{opacity:.08}}
@keyframes masterpiece-spark{0%,100%{opacity:1}50%{opacity:.25}}
.masterpiece-dialog[data-backdrop="comic"] .masterpiece-background{background:#fa27c1}
.masterpiece-dialog[data-backdrop="comic"] .masterpiece-rays{background:repeating-conic-gradient(from -6deg at 50% 29%,#17094f 0deg 11deg,#6725dc 11deg 22deg,#f832c7 22deg 33deg,#27dfff 33deg 35deg,#f832c7 35deg 44deg);mask-image:none}
.masterpiece-dialog[data-backdrop="comic"] .arcade-graphics,.masterpiece-dialog[data-backdrop="comic"] .masterpiece-horizon{display:none}
.masterpiece-dialog[data-backdrop="comic"] .comic-graphics{display:block}
.masterpiece-dialog[data-backdrop="futurist"] .masterpiece-background{background:radial-gradient(circle at 50% 26%,#307891 0,#172e47 32%,#091728 68%)}
.masterpiece-dialog[data-backdrop="futurist"] .masterpiece-rays{background:linear-gradient(110deg,#eaf9ff33 0,transparent 8% 88%,#d8f5ff55 100%),repeating-linear-gradient(0deg,transparent 0 4px,#8ce6ff0a 4px 5px);mask-image:none}
.masterpiece-dialog[data-backdrop="futurist"] .masterpiece-horizon{inset:0 0 auto;height:10%;background:linear-gradient(transparent,#30eaff1c,transparent);box-shadow:none;animation:masterpiece-scan 7s linear infinite}
.masterpiece-dialog[data-backdrop="futurist"] .arcade-graphics{display:none}
.masterpiece-dialog[data-backdrop="futurist"] .futurist-graphics{display:block}
@keyframes masterpiece-scan{from{transform:translateY(-100%)}to{transform:translateY(1100%)}}
@media(max-width:600px){.masterpiece-titlebar{grid-template-columns:20px minmax(0,1fr) 20px;gap:5px;padding:4px}.masterpiece-close,.masterpiece-minimize{width:20px;height:20px;font-size:23px}.masterpiece-window-label{padding:3px 5px;font-size:2.06cqw}.masterpiece-window{border-width:2px}}
@media(prefers-reduced-motion:reduce){.masterpiece-button-glow,.masterpiece-button-shine::after,.masterpiece-tagline,.arcade-sparks,.masterpiece-dialog[data-backdrop] .masterpiece-horizon{animation:none}.masterpiece-button-glow{opacity:.35}.masterpiece-button-shine::after{display:none}}

.masterpiece-start:focus-visible{outline:3px solid #fff8dc;outline-offset:5px}
.masterpiece-game-panel[hidden]{display:none}
.masterpiece-dialog[data-view="game"] .masterpiece-body>:not(.masterpiece-game-panel){display:none}
.masterpiece-game-panel{position:absolute;inset:0;overflow:hidden;background:#140708;border-radius:inherit}
.masterpiece-game{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;transform-origin:top left}
.masterpiece-game-loading{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;background:#090521;color:#fff8dc;text-align:center;font:700 clamp(14px,3cqw,22px)/1.4 'Courier New',monospace}
.masterpiece-game-retry{padding:10px 22px;border:2px solid #101540;border-radius:6px;background:#fff500;color:#101540;font:inherit;cursor:pointer}
.masterpiece-game-retry[hidden],.masterpiece-dialog[data-game-state="playing"] .masterpiece-game-loading{display:none}