@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#faf8ef;background:#9cbbbf;font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,input{font:inherit}button{cursor:pointer}#world{position:fixed;inset:0;width:100%;height:100%;display:block}body:has(#menu:not([hidden])):after{content:'';position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(15,31,27,.88),rgba(15,31,27,.25) 58%,rgba(15,31,27,.06))}header{position:fixed;z-index:3;left:4%;right:4%;top:32px;display:flex;align-items:center;justify-content:space-between}.brand{color:inherit;text-decoration:none;display:flex;gap:15px;align-items:center;font-weight:800;font-size:25px}.brand>span{font-size:15px;letter-spacing:.22em}#connection{font-size:10px;letter-spacing:.14em;background:#172c2585;padding:10px 14px;border:1px solid #ffffff26;border-radius:4px}#menu{position:absolute;z-index:2;left:8%;top:21%;width:500px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.22em;color:#c6d2ad}h1{font-family:Manrope,sans-serif;font-size:clamp(42px,5vw,76px);font-weight:500;line-height:1.1;letter-spacing:-.055em;margin:24px 0}p{font-size:14px;line-height:1.8;color:#d4dbcf}form{margin-top:26px;max-width:345px}label{display:block;font-size:9px;letter-spacing:.16em;margin:15px 0 7px;color:#c0cdbd}input{width:100%;color:#fff;background:#ffffff09;border:1px solid #ffffff32;border-radius:5px;padding:12px 14px;outline:none}input:focus{border-color:#c5dba6}button{border:0;border-radius:5px;padding:13px 17px;background:#d9e7bd;color:#20362a;font-weight:700}form button{width:100%;display:flex;justify-content:space-between;margin-top:17px}#error{color:#ffd8b5;font-size:13px;min-height:20px;margin-top:8px}.menu-foot{display:flex;gap:35px;margin-top:35px;font-size:8px;letter-spacing:.13em;color:#c2ccbb}#guide{position:fixed;z-index:2;bottom:9%;right:6%;border-left:1px solid #e2ebce66;padding-left:22px;text-shadow:0 2px 10px #172a24}#guide>span{font-size:9px;letter-spacing:.2em}h2{font:500 27px/1.25 Manrope,sans-serif;letter-spacing:-.04em}#guide p{font-size:12px}#guide small{font-size:10px;color:#d1d8c7}#hud{position:fixed;inset:0;pointer-events:none;z-index:4}#coords{position:absolute;top:90px;left:4%;font-size:11px;text-shadow:0 1px 4px #000}#crosshair{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:26px;font-weight:400;text-shadow:0 1px 3px #111}#hotbar{position:absolute;bottom:42px;left:50%;transform:translateX(-50%);display:flex;gap:6px;padding:7px;background:#162720b8;border-radius:10px;border:1px solid #ffffff30;pointer-events:auto}.slot{width:65px;height:65px;background:#ffffff0c;border:1px solid #ffffff18;color:#fff;padding:5px;position:relative;font-weight:400}.slot.active{border:2px solid #dfecbb;background:#d8eab525}.slot .swatch{display:block;width:22px;height:22px;margin:0 auto 4px;box-shadow:inset -5px -5px 0 #0002,inset 3px 3px 0 #fff2}.slot small{font-size:8px;display:block}.slot b{position:absolute;right:5px;top:3px;font-size:11px}.slot em{position:absolute;left:4px;top:3px;font-size:9px;opacity:.5;font-style:normal}#help{position:absolute;bottom:16px;width:100%;text-align:center;font-size:10px;text-shadow:0 1px 4px #000}#target{position:absolute;bottom:133px;width:100%;text-align:center;font-size:12px;text-shadow:0 1px 4px #000}#notice{position:absolute;top:95px;width:100%;text-align:center;font-size:12px;text-shadow:0 2px 4px #000}#pause{position:absolute;right:4%;top:85px;pointer-events:auto;background:#1c3229aa;color:white}#paused{position:fixed;inset:0;z-index:10;background:#10231acc;backdrop-filter:blur(9px);display:grid;place-items:center;text-align:center}#paused[hidden],[hidden]{display:none!important}#paused button{display:block;width:100%;margin-top:15px}.secondary{background:#ffffff15;color:#e5ecd8}#touch{display:none}.touch #touch{display:block;pointer-events:auto}.touch #help{display:none}.touch #pad{position:absolute;bottom:150px;left:25px;display:grid;grid-template-columns:repeat(3,45px);gap:5px}.touch #pad button:first-child{grid-column:2}.touch #pad button:nth-child(2){grid-column:1}.touch #actions{position:absolute;right:25px;bottom:150px;display:flex;gap:8px}.touch #touch button{background:#20362a99;color:#fff;touch-action:none;user-select:none;padding:14px 10px}body.playing{touch-action:none;user-select:none}@media(max-width:750px){header{top:20px}.brand>span{font-size:12px}#connection{font-size:8px}#menu{left:7%;top:17%;width:86%}h1{font-size:45px;margin:18px 0}#guide{display:none}form{max-width:350px;margin-top:16px}.menu-foot{margin-top:16px;gap:20px}#hotbar{bottom:20px;gap:3px}.slot{width:47px;height:57px}#target{bottom:100px}}@media(max-height:600px){#menu{top:18%;display:grid;grid-template-columns:1fr 1fr;gap:0 35px;width:85%}#menu .eyebrow{grid-column:1}#menu h1{font-size:40px;grid-column:1;margin:14px 0}#menu>p{grid-column:1;font-size:12px}#menu form{grid-column:2;grid-row:1/5;margin:0}#menu .menu-foot{grid-column:1/3;margin-top:5px}#guide{display:none}.touch #pad,.touch #actions{bottom:105px}}