:root{--s:2;--font:"Pixelify Sans", "Courier New", monospace;--panel:#8d95a3;--panel-hi:#c3cad6;--panel-lo:#464c58;--slot:#59606d;--slot-hi:#7c8492;--slot-lo:#343943;--btn:#4b5260;--btn-hi:#8a93a3;--btn-lo:#262a32;--btn-hover:#56709a;--text:#f4f4f4;--accent:#f2c84b}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;color:var(--text);font-family:var(--font);-webkit-user-select:none;user-select:none;background:#0b0d12;margin:0;overflow:hidden}img{image-rendering:pixelated}.app{font-size:calc(9px * var(--s));position:fixed;inset:0}.game-container,.game-canvas{outline:none;width:100%;height:100%;display:block;position:absolute;inset:0}.btn{font-family:var(--font);font-size:calc(9px * var(--s));color:var(--text);background:var(--btn);border:calc(1px * var(--s)) solid #000;box-shadow:inset calc(1px * var(--s)) calc(1px * var(--s)) 0 var(--btn-hi), inset calc(-1px * var(--s)) calc(-2px * var(--s)) 0 var(--btn-lo);height:calc(20px * var(--s));width:calc(98px * var(--s));cursor:pointer;text-shadow:calc(1px * var(--s)) calc(1px * var(--s)) 0 #2a2a2a;padding:0 calc(4px * var(--s));white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.btn.wide{width:calc(200px * var(--s))}.btn.small{width:calc(75px * var(--s))}.btn:hover:not(:disabled){background:var(--btn-hover);color:#ffffa0;border-color:#fff}.btn:disabled{color:#8a8a8a;cursor:default;box-shadow:none;text-shadow:none;background:#2c2f36}.row{gap:calc(4px * var(--s));justify-content:center;display:flex}.text-input{font-family:var(--font);font-size:calc(9px * var(--s));width:calc(200px * var(--s));height:calc(20px * var(--s));color:#e0e0e0;border:calc(1px * var(--s)) solid #a0a0a0;padding:0 calc(4px * var(--s));background:#000;outline:none}.text-input:focus{border-color:#fff}.slider{width:calc(150px * var(--s));height:calc(20px * var(--s));display:block;position:relative}.slider input{appearance:none;border:calc(1px * var(--s)) solid #000;cursor:pointer;background:#1c1f25;width:100%;height:100%;margin:0}.slider input::-webkit-slider-thumb{-webkit-appearance:none;width:calc(8px * var(--s));height:calc(20px * var(--s));background:var(--btn);border:calc(1px * var(--s)) solid #000;box-shadow:inset calc(1px * var(--s)) calc(1px * var(--s)) 0 var(--btn-hi), inset calc(-1px * var(--s)) calc(-1px * var(--s)) 0 var(--btn-lo)}.slider input::-moz-range-thumb{width:calc(8px * var(--s));height:calc(18px * var(--s));background:var(--btn);border:calc(1px * var(--s)) solid #000;border-radius:0}.slider input:hover::-webkit-slider-thumb{border-color:#fff}.slider span{pointer-events:none;text-shadow:calc(1px * var(--s)) calc(1px * var(--s)) 0 #2a2a2a;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.screen{z-index:20;flex-direction:column;align-items:center;display:flex;position:absolute;inset:0}.screen.dim:after{content:"";z-index:0;background:#0a0c148c;position:absolute;inset:0}.screen>*{z-index:1;position:relative}.screen>.panorama{z-index:0;position:absolute}.overlay-dim{background:#080a1099}.panorama{image-rendering:pixelated;filter:blur(calc(.6px * var(--s)));background-position:50%;background-size:cover;animation:80s linear infinite alternate pan;position:absolute;inset:-5%}@keyframes pan{0%{transform:translate(-2%)scale(1.08)}to{transform:translate(2%)scale(1.08)}}.title-logo{text-align:center;margin-top:12vh}.logo-text{font-size:calc(34px * var(--s));letter-spacing:calc(2px * var(--s));color:#b8bfca;background:linear-gradient(#e8edf4 0%,#a7afbd 45%,#6c7484 55%,#8e97a6 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(calc(2px * var(--s)) calc(2px * var(--s)) 0 #1a1d24) drop-shadow(0 0 calc(1px * var(--s)) #000);-webkit-background-clip:text;background-clip:text;font-weight:700}.logo-sub{margin-top:calc(4px * var(--s));color:var(--accent);text-shadow:calc(1px * var(--s)) calc(1px * var(--s)) 0 #3a2a00}.menu-col{margin-top:calc(28px * var(--s));gap:calc(4px * var(--s));flex-direction:column;align-items:center;display:flex}.menu-col .row .btn{width:calc(98px * var(--s))}.corner-left,.corner-right{bottom:calc(3px * var(--s));color:#fff;text-shadow:calc(1px * var(--s)) calc(1px * var(--s)) 0 #333;position:absolute!important}.corner-left{left:calc(3px * var(--s))}.corner-right{right:calc(3px * var(--s))}.screen-title{margin:calc(12px * var(--s)) 0 calc(8px * var(--s));font-size:calc(10px * var(--s));text-shadow:calc(1px * var(--s)) calc(1px * var(--s)) 0 #2a2a2a;font-weight:400}.bottom-buttons{bottom:calc(10px * var(--s));gap:calc(4px * var(--s));flex-direction:column;align-items:center;display:flex;position:absolute!important}.bottom-buttons .row .btn{width:calc(150px * var(--s))}.world-list{width:calc(270px * var(--s));max-height:calc(100vh - 110px * var(--s));border-top:calc(1px * var(--s)) solid #000;border-bottom:calc(1px * var(--s)) solid #000;padding:calc(4px * var(--s));background:#00000073;flex:1;overflow-y:auto}.world-entry{padding:calc(3px * var(--s)) calc(6px * var(--s));border:calc(1px * var(--s)) solid transparent;cursor:pointer;margin-bottom:calc(2px * var(--s))}.world-entry.selected{background:#0009;border-color:silver}.world-name{color:#fff}.world-info{color:#8a8a8a}.empty{color:#aaa;text-align:center;margin-top:calc(30px * var(--s))}.form{gap:calc(4px * var(--s));margin-top:calc(6px * var(--s));flex-direction:column;align-items:flex-start;display:flex}.form label{color:#a0a0a0;margin-top:calc(4px * var(--s))}.hint{color:#a0a0a0;font-size:calc(7px * var(--s));max-width:calc(200px * var(--s));margin-bottom:calc(4px * var(--s))}.center-box{text-align:center;margin-top:30vh}.center-box h2{font-weight:400;font-size:calc(10px * var(--s))}.center-box p{color:#a0a0a0}.options-grid{grid-template-columns:repeat(2, calc(150px * var(--s)));gap:calc(4px * var(--s)) calc(10px * var(--s));display:grid}.options-grid .btn{width:calc(150px * var(--s))}.keys-list{width:calc(280px * var(--s));max-height:calc(100vh - 80px * var(--s));padding:calc(4px * var(--s)) calc(10px * var(--s));background:#00000073;overflow-y:auto}.key-row{height:calc(22px * var(--s));justify-content:space-between;align-items:center;display:flex}.key-fixed{color:#a0a0a0;width:calc(75px * var(--s));text-align:center}.key-btn.dupe{color:#f55}.loading-screen{background:#12151c;justify-content:center}.loading-box{text-align:center}.loading-title{margin-bottom:calc(8px * var(--s))}.progress{width:calc(180px * var(--s));height:calc(4px * var(--s));border:calc(1px * var(--s)) solid #000;background:#3a3f4a}.progress>div{background:#7fd16a;height:100%;transition:width .2s}.loading-pct{margin-top:calc(6px * var(--s));color:#a0a0a0}.death-screen{background:linear-gradient(#6e000073,#280000b3)}.death-title{font-size:calc(20px * var(--s));text-shadow:calc(2px * var(--s)) calc(2px * var(--s)) 0 #3a0000;margin-top:20vh;font-weight:400}.death-msg{margin-top:calc(4px * var(--s))}.death-score{margin-top:calc(10px * var(--s))}.death-score span{color:#ff5}.click-to-play{z-index:15;cursor:pointer;background:#00000040;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.click-to-play div{padding:calc(6px * var(--s)) calc(12px * var(--s));border:calc(1px * var(--s)) solid #888;background:#0009}.hud{pointer-events:none;z-index:5;position:absolute;inset:0}.crosshair{width:calc(9px * var(--s));height:calc(9px * var(--s));mix-blend-mode:difference;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.crosshair:before,.crosshair:after{content:"";background:#fff;position:absolute}.crosshair:before{left:calc(4px * var(--s));width:calc(1px * var(--s));height:100%;top:0}.crosshair:after{top:calc(4px * var(--s));height:calc(1px * var(--s));width:100%;left:0}.hotbar-wrap{width:calc(182px * var(--s));height:calc(22px * var(--s));position:absolute;bottom:0;left:50%;transform:translate(-50%)}.hotbar{border:calc(1px * var(--s)) solid #0b0c0f;box-shadow:inset 0 0 0 calc(1px * var(--s)) #5b6270;background:#14161ca6;position:absolute;inset:0}.hotbar:before{content:"";inset:calc(1px * var(--s));background:repeating-linear-gradient(90deg, transparent 0, transparent calc(19px * var(--s)), #3a3f49 calc(19px * var(--s)), #3a3f49 calc(20px * var(--s)));position:absolute}.offhand-slot{left:calc(-29px * var(--s));width:calc(22px * var(--s));height:calc(22px * var(--s));border:calc(1px * var(--s)) solid #0b0c0f;box-shadow:inset 0 0 0 calc(1px * var(--s)) #5b6270;background:#14161ca6;position:absolute;bottom:0}.hb-item{width:calc(16px * var(--s));height:calc(16px * var(--s));position:absolute}.hb-select{top:calc(-2px * var(--s));width:calc(24px * var(--s));height:calc(24px * var(--s));border:calc(2px * var(--s)) solid #f4f4f4;outline:calc(1px * var(--s)) solid #1a1a1a;box-shadow:inset 0 0 0 calc(1px * var(--s)) #1a1a1a;position:absolute}.bars{height:0;position:absolute;bottom:0;left:0;right:0}.bar-left,.bar-right{width:calc(81px * var(--s));position:absolute;bottom:0}.bar-left{left:0}.bar-right{right:0}.hud-icon{width:calc(9px * var(--s));height:calc(9px * var(--s));position:absolute}.xpbar{width:calc(182px * var(--s));height:calc(5px * var(--s));border:calc(1px * var(--s)) solid #000;background:#1a1f12;position:absolute;left:0}.xpfill{background:linear-gradient(#b8f05a,#6fb82a);height:100%}.xplevel{color:#8cf04a;text-shadow:calc(1px * var(--s)) 0 0 #000, calc(-1px * var(--s)) 0 0 #000, 0 calc(1px * var(--s)) 0 #000, 0 calc(-1px * var(--s)) 0 #000;position:absolute;left:50%;transform:translate(-50%)}.held-name,.actionbar{white-space:nowrap;text-shadow:calc(1px * var(--s)) calc(1px * var(--s)) 0 #333;position:absolute;left:50%;transform:translate(-50%)}.actionbar{color:#fff}.debug{left:calc(2px * var(--s));top:calc(2px * var(--s));font-size:calc(8px * var(--s));line-height:calc(10px * var(--s));position:absolute}.debug span{padding:0 calc(1px * var(--s));color:#e0e0e0;background:#3c3c3c8c}.debug .gap{height:calc(10px * var(--s))}.chat-log{left:calc(2px * var(--s));bottom:calc(40px * var(--s));width:calc(320px * var(--s));max-width:60vw;font-size:calc(8px * var(--s));line-height:calc(9px * var(--s));position:absolute}.chat-log>div{padding:0 calc(2px * var(--s));text-shadow:calc(1px * var(--s)) calc(1px * var(--s)) 0 #333;word-break:break-word;background:#00000073}.chat-open{z-index:25;position:absolute;inset:0}.chat-log.open{bottom:calc(16px * var(--s))}.chat-input{left:calc(2px * var(--s));right:calc(2px * var(--s));bottom:calc(2px * var(--s));height:calc(12px * var(--s));color:#fff;font-family:var(--font);font-size:calc(8px * var(--s));padding:0 calc(2px * var(--s));background:#0000008c;border:none;outline:none;position:absolute}.overlay-water{background:radial-gradient(#14328c26,#0a195a73);position:absolute;inset:0}.overlay-fire{background:linear-gradient(#0000,#ff6e1459 50%,#ffaa288c);height:40%;animation:.15s steps(2,end) infinite flicker;position:absolute;bottom:0;left:0;right:0}@keyframes flicker{50%{opacity:.75}}.overlay-pumpkin{background:radial-gradient(48% 34% at 50% 46%,#0000 55%,#221000eb 100%);position:absolute;inset:0}.overlay-sleep{background:#05060a;position:absolute;inset:0}.item{width:calc(16px * var(--s));height:calc(16px * var(--s));position:relative}.item img{width:100%;height:100%;display:block}.item .count{right:calc(-1px * var(--s));bottom:calc(-2px * var(--s));font-size:calc(9px * var(--s));color:#fff;text-shadow:calc(1px * var(--s)) calc(1px * var(--s)) 0 #3f3f3f;line-height:1;position:absolute}.durability{left:calc(2px * var(--s));bottom:calc(1px * var(--s));width:calc(13px * var(--s));height:calc(2px * var(--s));background:#000;position:absolute}.durability>div{height:50%}.container-backdrop{z-index:30;background:#080a1099;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.container-wrap{position:relative}.panel{background:var(--panel);border:calc(1px * var(--s)) solid #0d0f13;box-shadow:inset calc(2px * var(--s)) calc(2px * var(--s)) 0 var(--panel-hi), inset calc(-2px * var(--s)) calc(-2px * var(--s)) 0 var(--panel-lo);border-radius:calc(2px * var(--s));position:relative}.panel .label{color:#2a2e36;font-size:calc(8px * var(--s));line-height:1;position:absolute}.slot{background:var(--slot);box-shadow:inset calc(1px * var(--s)) calc(1px * var(--s)) 0 var(--slot-lo), inset calc(-1px * var(--s)) calc(-1px * var(--s)) 0 var(--slot-hi);cursor:default;position:absolute}.slot.hover:after,.slot.dragged:after{content:"";inset:calc(1px * var(--s));pointer-events:none;background:#ffffff73;position:absolute}.slot-item{width:calc(16px * var(--s));height:calc(16px * var(--s));position:absolute}.slot.trash{background:#6d3a3a}.slot.trash:before{content:"✕";color:#e8b0b0;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.figure-box{box-shadow:inset calc(1px * var(--s)) calc(1px * var(--s)) 0 #000, inset calc(-1px * var(--s)) calc(-1px * var(--s)) 0 #6a7280;background:#111317;justify-content:center;display:flex;position:absolute}.arrow{width:calc(22px * var(--s));height:calc(15px * var(--s));clip-path:polygon(0 35%,60% 35%,60% 0,100% 50%,60% 100%,60% 65%,0 65%);background:#5f6673;position:absolute}.furnace-arrow .arrow-fill{background:#f4f4f4;height:100%}.flame{width:calc(14px * var(--s));height:calc(14px * var(--s));clip-path:polygon(50% 0,70% 30%,90% 25%,100% 70%,80% 100%,20% 100%,0 70%,15% 35%,35% 45%);background:#5f6673;align-items:flex-end;display:flex;position:absolute}.flame-fill{background:linear-gradient(#ffe26a,#ff7a1a);width:100%}.cursor-item{pointer-events:none;z-index:40;position:fixed;transform:translate(-50%,-50%)}.tooltip{z-index:41;pointer-events:none;border:calc(1px * var(--s)) solid #2a0a5a;outline:calc(1px * var(--s)) solid #100010;padding:calc(3px * var(--s)) calc(4px * var(--s));font-size:calc(8px * var(--s));line-height:calc(10px * var(--s));white-space:nowrap;background:#100212f0;position:fixed}.tip-gray{color:#a8a8a8}.tip-blue{color:#6a8aff}.tip-green{color:#5f5}.tabs{gap:calc(1px * var(--s));margin-bottom:calc(-1px * var(--s));display:flex}.tab{width:calc(21px * var(--s));height:calc(22px * var(--s));border:calc(1px * var(--s)) solid #0d0f13;cursor:pointer;border-radius:calc(2px * var(--s)) calc(2px * var(--s)) 0 0;background:#6e7684;border-bottom:none;justify-content:center;align-items:center;display:flex}.tab.active{background:var(--panel);height:calc(24px * var(--s));margin-top:calc(-2px * var(--s));z-index:2;position:relative}.search{border:calc(1px * var(--s)) solid #a0a0a0;color:#fff;font-family:var(--font);font-size:calc(8px * var(--s));padding:0 calc(2px * var(--s));background:#000;outline:none;position:absolute}.scrollbar{width:calc(12px * var(--s));background:#3a3f49;position:absolute}.thumb{width:100%;height:calc(15px * var(--s));box-shadow:inset calc(-1px * var(--s)) calc(-1px * var(--s)) 0 #6a7280;background:#b8bfca;position:absolute;left:0}