@font-face{font-family:VT323;src:url(/_astro/VT323-Regular.DICElq-Y.ttf)format("truetype");font-display:swap}:root{--bg:#1a1a1a;--win:#e9e4cf;--border:#101010;--shadow:#071c4a;--text:#262104;--yb:#ffe94d;--tb:#c9c9c9;--tb-hi:#efefef;--tb-lo:#7d7d7d}*{box-sizing:border-box;margin:0;padding:0;border-radius:0!important}html,body{color:var(--text);background:var(--bg);image-rendering:pixelated;user-select:none;background-image:radial-gradient(#ffffff21 1px,#0000 1px);background-size:7px 7px;min-height:100dvh;font-family:VT323,ui-monospace,monospace;font-size:18px;line-height:1.35}img{-webkit-user-drag:none;user-drag:none}input,textarea{user-select:text}a{color:inherit}button{font:inherit;cursor:pointer;user-select:none}.dim{opacity:.65}.small{font-size:15px}.sp{flex:1}#topbar{z-index:100;background:var(--tb);color:#1a1a1a;border-bottom:2px solid var(--border);height:46px;box-shadow:inset 0 2px 0 var(--tb-hi), inset 0 -2px 0 var(--tb-lo);align-items:center;gap:14px;padding:0 16px;display:flex;position:fixed;top:0;left:0;right:0}#topbar .tb-title{letter-spacing:2px;font-size:24px}#topbar a{color:#1a1a1a;background:var(--tb);border:2px solid;border-color:var(--tb-hi) var(--tb-lo) var(--tb-lo) var(--tb-hi);padding:0 8px;font-size:16px;line-height:22px;text-decoration:none}#topbar a:hover{background:var(--tb-hi)}main{justify-content:center;padding:80px 16px 40px;display:flex}.win{background-color:var(--win);border:2px solid var(--border);width:min(560px,100%);box-shadow:4px 4px 0 var(--shadow), inset 0 0 0 2px #fff6;background-image:repeating-conic-gradient(#0000000e 0% 25%,#0000 0% 50%);background-size:6px 6px;padding:10px 16px 16px}.win-title{color:var(--border);white-space:nowrap;background:#0000001a;margin:-4px -10px 10px;padding:1px 6px;overflow:hidden}.sq{vertical-align:middle;border:1px solid var(--border);width:8px;height:8px;margin:0 2px;display:inline-block}.sq.r{background:#c81111}.sq.b{background:#1233c8}.opener{margin-bottom:14px;font-style:italic}.row{border-top:2px dashed #0003;align-items:flex-start;gap:14px;padding:10px 0;display:flex}.lbl{opacity:.75;flex-shrink:0;width:90px;padding-top:2px}#cname{font:inherit;color:var(--text);caret-color:#c81111;background:0 0;border:none;border-bottom:2px solid #0006;outline:none;flex:1;padding:1px 0}#cname.bad{border-bottom-color:#c81111}.reqerr{color:#c81111;font-size:15px}.sprite-row{align-items:center}.spritebox{flex:1}#sprite{border:2px solid var(--border);width:190px;height:190px;box-shadow:3px 3px 0 var(--shadow);image-rendering:pixelated;background:#efe9d8;display:block}#sprite.flash{animation:.3s ease-out spriteflash}.gen-2{transform:scaleX(-1)}.gen-3{filter:invert()}.gen-4{filter:invert();transform:scaleX(-1)}@keyframes spriteflash{0%{filter:brightness(1.8)contrast(.6)}to{filter:brightness()}}.tinybtn{border:2px solid var(--border);color:#1a1503;box-shadow:2px 2px 0 var(--shadow);background:#efe9d8;padding:2px 10px;font-size:16px}.tinybtn:active{box-shadow:none;transform:translate(2px,2px)}.stats{flex:1}.statrow{align-items:center;gap:8px;padding:2px 0;display:flex}.statrow .sname{width:90px;font-size:16px}.statrow .bar{letter-spacing:2px;flex:1;font-size:16px}.statrow button{border:2px solid var(--border);width:24px;box-shadow:2px 2px 0 var(--shadow);background:#efe9d8;font-size:15px;line-height:1.1}.statrow button:active{box-shadow:none;transform:translate(1px,1px)}.statrow button:disabled{opacity:.35;cursor:default}#pool{margin-bottom:4px}.classbox{flex:1}#cclass{letter-spacing:1px;font-size:22px}#create{letter-spacing:4px;width:100%;color:var(--yb);border:2px solid var(--border);box-shadow:4px 4px 0 var(--shadow);background:#c81111;margin-top:14px;padding:12px;font-size:26px;transition:transform 50ms,box-shadow 50ms;display:block}#create:active{box-shadow:2px 2px 0 var(--shadow);transform:translateY(2px)}#saved{margin-top:8px}@media (width<=640px){#topbar{flex-wrap:wrap;gap:6px 10px;height:auto;padding:8px 12px;position:static}#topbar .tb-title{width:100%;font-size:20px}main{padding:16px 10px 32px}.row{flex-direction:column;gap:8px}.lbl{width:auto;padding-top:0}#cname{width:100%}.sprite-row{align-items:flex-start}#sprite{width:160px;height:160px}}