:root{--bg: #0f172a;--panel: #1e293b;--accent: #22c55e;--text: #f8fafc;--border: #000000}*{box-sizing:border-box;margin:0;padding:0;image-rendering:pixelated}body{background:#000;color:var(--text);font-family:"monospace";overflow:hidden}.pixel-world{width:100vw;height:100vh;display:flex;flex-direction:column;background:var(--bg);position:relative}.scanline{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:100;background:linear-gradient(#12101000 50%,#0000001a 50%);background-size:100% 4px}.ui-header{height:60px;background:var(--panel);border-bottom:4px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 20px}.sync-status{font-size:12px;color:#22d3ee;display:flex;align-items:center;gap:5px}.stats-bar{display:flex;gap:15px}.stat{display:flex;align-items:center;gap:6px}.progress{width:80px;height:10px;background:#000;border:2px solid #334155}.fill{height:100%;transition:width .3s}.fill.hp{background:#ff4757}.fill.hunger{background:#ffa502}.game-container{flex:1;display:flex;overflow:hidden}.map-area{flex:1;position:relative;overflow:hidden;cursor:crosshair;background:#14532d;border-right:4px solid var(--border)}.grass-bg{position:absolute;top:0;right:0;bottom:0;left:0;background-size:256px;background-repeat:repeat;background-image:linear-gradient(45deg,#14532d 25%,#166534 25%,#166534 50%,#14532d 50%,#14532d 75%,#166534 75%,#166534)}.night-filter{position:absolute;top:0;right:0;bottom:0;left:0;background:#0f172a99;pointer-events:none}.ent{position:absolute;width:44px;height:44px;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;font-size:28px;z-index:10}.ent img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(2px 2px 0 #000)}.player-sprite{position:absolute;width:50px;height:50px;transform:translate(-50%,-50%);z-index:20;display:flex;align-items:center;justify-content:center;font-size:36px}.player-sprite img{width:100%;height:100%;object-fit:contain}.harvest-hint{position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;border:2px dashed #fde047;border-radius:50%;animation:spin 3s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.side-panel{width:300px;background:var(--panel);display:flex;flex-direction:column}.mode-tabs,.content-tabs{display:flex;padding:10px;gap:8px;border-bottom:2px solid #000}.mode-tabs button,.content-tabs button{flex:1;padding:8px;background:#0f172a;border:2px solid #000;color:#64748b;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:5px;font-size:12px}.mode-tabs button.on,.content-tabs button.on{background:var(--accent);color:#000;font-weight:700}.list-view{flex:1;padding:15px;overflow-y:auto;background:#020617}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.slot{background:#1e293b;border:2px solid #000;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;cursor:pointer}.slot.pick{border-color:#fde047;background:#334155}.slot .ico{font-size:24px}.slot .num{position:absolute;bottom:2px;right:4px;font-size:10px;color:#94a3b8}.craft-box{display:flex;flex-direction:column;gap:10px}.recipe{background:#1e293b;border:2px solid #000;padding:10px;display:flex;justify-content:space-between;align-items:center}.recipe.can{border-color:var(--accent)}.r-info b{font-size:14px;display:block}.r-info p{font-size:10px;color:#94a3b8}.recipe button{padding:6px 12px;background:#334155;border:2px solid #000;color:#fff;cursor:pointer}.recipe.can button{background:var(--accent);color:#000}.ghost-label{position:absolute;top:-35px;background:#fde047;color:#000;padding:2px 6px;font-size:10px;white-space:nowrap;border:2px solid #000}